Pages: 1
:arrow: Inspirated from Yuan (http://theftalk.com/t54804-ABOUT-MOUSE-CLICK-on-OVERLAY-%3D(.html) [b]First[/b], Save this Code to your host [spoiler][code]function ddtabcontent(tabinterfacei
You are viewing a post by Xien. View all 3 posts in :arrow: Inspirated from Yuan (http://theftalk.com/t54804-ABOUT-MOUSE-CLICK-on-OVERLAY-%3D(.html) [b]First[/b], Save this Code to your host [spoiler][code]function ddtabcontent(tabinterfacei.
2009-01-17 02:11:30
- Xien
- » FTalker
128
0
1969-12-31
:arrow: Inspirated from Yuan (http://theftalk.com/t54804-ABOUT-MOUSE-CLICK-on-OVERLAY-%3D(.html) [b]First[/b], Save this Code to your host [spoiler][code]function ddtabcontent(tabinterfacei
Inspirated from Yuan (http://theftalk.com/t54804-ABOUT-MOUSE-CLICK-on-OVERLAY-%3D(.html)
[b]First[/b], Save this Code to your host
[spoiler]<">[/spoiler]
[b]Second[/b], Create HTML from this code
[spoiler]<html>
<head>
<style type="text/css">
.indentmenu{
font: bold 13px Arial;
width: 100%; /*leave this value as is in most cases*/
}
.indentmenu ul{
margin: 0;
padding: 0;
float: left;
/* width: 80%; width of menu*/
border-top: 1px solid navy; /*navy border*/
background: aliceblue url(indentbg.gif) center center repeat-x;
}
.indentmenu ul li{
display: inline;
}
.indentmenu ul li a{
float: left;
color: white; /*text color*/
padding: 5px 11px;
text-decoration: none;
border-right: 1px solid navy; /*navy divider between menu items*/
}
.indentmenu ul li a:visited{
color: white;
}
.indentmenu ul li a.selected{
color: white !important;
padding-top: 6px; /*shift text down 1px*/
padding-bottom: 4px;
background: aliceblue url(indentbg2.gif) center center repeat-x;
}
.tabcontentstyle{ /*style of tab content oontainer*/
border: 1px solid gray;
width: 450px;
margin-bottom: 1em;
padding: 10px;
}
.tabcontent{
font: bold 12px Trebuchet MS;
display:none;
}
@media print {
.tabcontent {
display:block !important;
}
}
</style>
<script type="text/javascript" src="[color=blue][b]YOUR JS FILE LINK THAT YOU COPY-PASTE FROM FIRST TUTOR[/b][/color]"></script>
</head>
<body>
<div id="pettabs" class="indentmenu">
<ul>
<li><a href="#" rel="dog1" class="selected">1</a></li>
<li><a href="#" rel="dog2">2</a></li>
</ul>
<br style="clear: left" />
</div>
<div style="border 0px ridge aliceblue; width:480px; height: 150px; padding: 5px; margin-bottom:1em">
<div id="dog1" class="tabcontent">
[color=red][b]YOUR FIRST CONTENT[/b][/color]
</div>
<div id="dog2" class="tabcontent">
[color=red][b]YOUR SECOND CONTENT[/b][/color]
</div>
</div>
<script type="text/javascript">
var mypets=new ddtabcontent("pettabs")
mypets.setpersist(true)
mypets.setselectedClassTarget("link")
mypets.init(2500)
</script>
</body>
</html>[/spoiler]
[i]Info[/i]
[color=blue]Blue[/color] is Your JS Link that you saved from first tutor
[color=red]Red[/color] is your content
Thx.. 
 |