http://www.azsawfrugby.yoyo.pl/test/test.php
Najprawdopodobniej brakuje mi jakiejs lini kodu w CSS. walcze z tym juz od rana i niestety nie jestem w stanie sobie z tym poradzic
KOD JAVA:
Kod
//EASY TABS 1.2 - MENU SETTINGS
//Set the id names of your tablinks (without a number at the end)
var tablink_idname = new Array("tablink","anotherlink")
//Set the id names of your tabcontentareas (without a number at the end)
var tabcontent_idname = new Array("tabcontent","anothercontent")
//Set the number of your tabs in each menu
var tabcount = new Array("4")
//Set the Tabs wich should load at start (In this Example:Menu 1 -> Tab 2 visible on load, Menu 2 -> Tab 5 visible on load)
var loadtabs = new Array("1")
//Set the Number of the Menu which should autochange (if you dont't want to have a change menu set it to 0)
var autochangemenu = 0;
//the speed in seconds when the tabs should change
var changespeed = 0;
//should the autochange stop if the user hover over a tab from the autochangemenu? 0=no 1=yes
var stoponhover = 0;
//END MENU SETTINGS
/*Swich EasyTabs Functions - no need to edit something here*/
function easytabs(menunr, active) {if (menunr == autochangemenu){currenttab=active;}if ((menunr == autochangemenu)&&(stoponhover==1)) {stop_autochange()} else if ((menunr == autochangemenu)&&(stoponhover==0)) {counter=0;} menunr = menunr-1;for (i=1; i <= tabcount[menunr]; i++){document.getElementById(tablink_idname[menunr]+i).className='tab'+i;document.getElementById(tabcontent_idname[menunr]+i).style.display = 'none';}document.getElementById(tablink_idname[menunr]+active).className='tab'+active+' tabactive';document.getElementById(tabcontent_idname[menunr]+active).style.display = 'block';}var timer; counter=0; var totaltabs=tabcount[autochangemenu-1];var currenttab=loadtabs[autochangemenu-1];function start_autochange(){counter=counter+1;timer=setTimeout("start_autochange()",1000);if (counter == changespeed+1) {currenttab++;if (currenttab>totaltabs) {currenttab=1}easytabs(autochangemenu,currenttab);restart_autochange();}}function restart_autochange(){clearTimeout(timer);counter=0;start_autochange();}function stop_autochange(){clearTimeout(timer);counter=0;}
window.onload=function(){
var menucount=loadtabs.length; var a = 0; var b = 1; do {easytabs(b, loadtabs[a]); a++; b++;}while (b<=menucount);
if (autochangemenu!=0){start_autochange();}
}
//Set the id names of your tablinks (without a number at the end)
var tablink_idname = new Array("tablink","anotherlink")
//Set the id names of your tabcontentareas (without a number at the end)
var tabcontent_idname = new Array("tabcontent","anothercontent")
//Set the number of your tabs in each menu
var tabcount = new Array("4")
//Set the Tabs wich should load at start (In this Example:Menu 1 -> Tab 2 visible on load, Menu 2 -> Tab 5 visible on load)
var loadtabs = new Array("1")
//Set the Number of the Menu which should autochange (if you dont't want to have a change menu set it to 0)
var autochangemenu = 0;
//the speed in seconds when the tabs should change
var changespeed = 0;
//should the autochange stop if the user hover over a tab from the autochangemenu? 0=no 1=yes
var stoponhover = 0;
//END MENU SETTINGS
/*Swich EasyTabs Functions - no need to edit something here*/
function easytabs(menunr, active) {if (menunr == autochangemenu){currenttab=active;}if ((menunr == autochangemenu)&&(stoponhover==1)) {stop_autochange()} else if ((menunr == autochangemenu)&&(stoponhover==0)) {counter=0;} menunr = menunr-1;for (i=1; i <= tabcount[menunr]; i++){document.getElementById(tablink_idname[menunr]+i).className='tab'+i;document.getElementById(tabcontent_idname[menunr]+i).style.display = 'none';}document.getElementById(tablink_idname[menunr]+active).className='tab'+active+' tabactive';document.getElementById(tabcontent_idname[menunr]+active).style.display = 'block';}var timer; counter=0; var totaltabs=tabcount[autochangemenu-1];var currenttab=loadtabs[autochangemenu-1];function start_autochange(){counter=counter+1;timer=setTimeout("start_autochange()",1000);if (counter == changespeed+1) {currenttab++;if (currenttab>totaltabs) {currenttab=1}easytabs(autochangemenu,currenttab);restart_autochange();}}function restart_autochange(){clearTimeout(timer);counter=0;start_autochange();}function stop_autochange(){clearTimeout(timer);counter=0;}
window.onload=function(){
var menucount=loadtabs.length; var a = 0; var b = 1; do {easytabs(b, loadtabs[a]); a++; b++;}while (b<=menucount);
if (autochangemenu!=0){start_autochange();}
}
KOD CSS
Kod
.all{
height:auto;
width:600px
}
.menu {
height:23px;
width:150px;
float:left;
}
.menu ul {
margin:0px;
padding:0px;
list-style:none;
text-align:center;
}
.menu li {
display:inline;
line-height:23px;
}
.menu li a {
color:#ccaf57;
text-decoration:none;
padding:1px 1px 1px 1px;
}
.menu li a.tabactive {
color:#4f8650;
font-weight:bold;
position:relative;
}
#tabcontent1,#tabcontent2,#tabcontent3,#tabcontent4 {
width:440px;
height:370px;
padding:0px 0px 0px 0px;
font-size:12px;
margin-bottom:5px;
float:left;
text-align:left;
}
.menurealizacjeall h1 {
font-weight: normal;
padding-bottom: 10px;
border-bottom: 1px dashed #2d1c08;
font-size: 25px;
margin-left:20px;
margin-right:20px;
text-align:left;
}
#tabcontent1 img {
float: left;
margin: 0px 20px 20px 20px;
border: 2px solid #ae903d;
padding: 2px;
background: #2d1c08;
width:200;
height:145
}
height:auto;
width:600px
}
.menu {
height:23px;
width:150px;
float:left;
}
.menu ul {
margin:0px;
padding:0px;
list-style:none;
text-align:center;
}
.menu li {
display:inline;
line-height:23px;
}
.menu li a {
color:#ccaf57;
text-decoration:none;
padding:1px 1px 1px 1px;
}
.menu li a.tabactive {
color:#4f8650;
font-weight:bold;
position:relative;
}
#tabcontent1,#tabcontent2,#tabcontent3,#tabcontent4 {
width:440px;
height:370px;
padding:0px 0px 0px 0px;
font-size:12px;
margin-bottom:5px;
float:left;
text-align:left;
}
.menurealizacjeall h1 {
font-weight: normal;
padding-bottom: 10px;
border-bottom: 1px dashed #2d1c08;
font-size: 25px;
margin-left:20px;
margin-right:20px;
text-align:left;
}
#tabcontent1 img {
float: left;
margin: 0px 20px 20px 20px;
border: 2px solid #ae903d;
padding: 2px;
background: #2d1c08;
width:200;
height:145
}
KOD PHP
Kod
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<title>test</title>
<link href="test.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="easytabs.js"></script>
</head>
<body onload="preload();">
<div class="all">
<!--menu -->
<div class="menu">
<ul>
<!--menu1 -->
<li><a href="#" onmouseover="easytabs('1', '1');" onfocus="easytabs('1', '1');" onclick="return false;" title="" id="tablink1">1</a></li></ul>
<!--menu2 -->
<ul><li><a href="#" onmouseover="easytabs('1', '2');" onfocus="easytabs('1', '2');" onclick="return false;" title="" id="tablink2">2</a></li></ul>
<!--menu3 -->
<ul><li><a href="#" onmouseover="easytabs('1', '3');" onfocus="easytabs('1', '3');" onclick="return false;" title="" id="tablink3">3</a></li></ul>
<!--menu4 -->
<ul><li><a href="#" onmouseover="easytabs('1', '4');" onfocus="easytabs('1', '4');" onclick="return false;" title="" id="tablink4">4</a></li>
</ul>
</div>
<!--Start Tabcontent 1 -->
<div id="tabcontent1">Tabcontent 1</div>
<!--Start Tabcontent 2-->
<div id="tabcontent2">Tabcontent 2</div>
<!--Start Tabcontent 3-->
<div id="tabcontent3">Tabcontent 3</div>
<!--Start Tabcontent 4-->
<div id="tabcontent4">Tabcontent 4</div>
</div>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<title>test</title>
<link href="test.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="easytabs.js"></script>
</head>
<body onload="preload();">
<div class="all">
<!--menu -->
<div class="menu">
<ul>
<!--menu1 -->
<li><a href="#" onmouseover="easytabs('1', '1');" onfocus="easytabs('1', '1');" onclick="return false;" title="" id="tablink1">1</a></li></ul>
<!--menu2 -->
<ul><li><a href="#" onmouseover="easytabs('1', '2');" onfocus="easytabs('1', '2');" onclick="return false;" title="" id="tablink2">2</a></li></ul>
<!--menu3 -->
<ul><li><a href="#" onmouseover="easytabs('1', '3');" onfocus="easytabs('1', '3');" onclick="return false;" title="" id="tablink3">3</a></li></ul>
<!--menu4 -->
<ul><li><a href="#" onmouseover="easytabs('1', '4');" onfocus="easytabs('1', '4');" onclick="return false;" title="" id="tablink4">4</a></li>
</ul>
</div>
<!--Start Tabcontent 1 -->
<div id="tabcontent1">Tabcontent 1</div>
<!--Start Tabcontent 2-->
<div id="tabcontent2">Tabcontent 2</div>
<!--Start Tabcontent 3-->
<div id="tabcontent3">Tabcontent 3</div>
<!--Start Tabcontent 4-->
<div id="tabcontent4">Tabcontent 4</div>
</div>
</body>
</html>
Jesli ktos bylby w stanie pomoc, z góry dziękuję.
Pozdrawiam