Hallo
Ich habe erst kürzlich unsere Clanpage auf Vordermann gebracht mit neuem Design und natürlich wollten wir auch so einen TS3 Slider. Soweit so gut. Habe nach Anleitung das auch hinbekommen.
Nun habe ich ein Problem, dass jedes mal der Slider schon draussen ist wenn man die Seite öffnet. Zum Schliessen habe ich zwar mouseover gewählt, was aber irgendwie nur jedes 2. Mal klappt. mousklick zum Öffnen und Schliessen wäre mir aber am Liebsten. Nur bekomme ich das irgendwie nicht hin.
Ich habe den Verdacht, dass sich die 2 Slider beissen (also der schon vorhandene aus dem Design). Denn mit einem anderen Design hat das mit dem TSSlider perfekt funktioniert.
Auf jeden Fall muss ich zuerst den Code so hinkriegen, dass ich erst klicke und dann der Slider sich öffnen soll und nicht schon offen ist wenn man auf die Seite kommt.
Danke für jeden Tip
Hier der Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>{TITLE}</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="include/designs/DDvXdr/style.css">
<link rel="stylesheet" href="include/designs/DDvXdr/slider/themes/pascal/pascal.css" type="text/css" media="screen" />
<link rel="stylesheet" href="include/designs/DDvXdr/slider/themes/orman/orman.css" type="text/css" media="screen" />
<link rel="stylesheet" href="include/designs/DDvXdr/slider/slider.css" type="text/css" media="screen" />
<style type="text/css">
.hame
{
display: block;
border:none;
color: #FFF;
font-size: 12px;
width: 208px;
text-indent: 52px;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height:26px;
background: url(include/designs/DDvXdr/Bilder/button_sitemenu.png);
}
.hame:hover
{
display: block;
border:none;
color: #FFF;
font-size: 12px;
width: 208px;
text-indent: 62px;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height:26px;
background: url(include/designs/DDvXdr/Bilder/button_sitemenu_2.png);
}
/*--Setzt alle Abstände auf "Null"--*/
* {
margin: 0;
padding: 0;
}
/*--formatiert die Menüleiste + BGcolor Blau--*/
#menu {
width: 1100px;
height:38px;
background: ;
font-family: Verdana;
font-size: 1em;
line-height: 1.5;
float: left;
}
/*--formatiert die Themenblöcke - Nebeneinander--*/
#menu ul {
float: left;
width: 119px;
list-style-type: none;
padding-top: 2px;
}
/*
*verhindert im Zusammenhang mit position absolute bei ul ul
*eine Höhenvergrößerung von #menu beim Hovern--
*/
#menu li {
position: relative;
}
/*--versteckt die "Drop-Down-Links", solange nicht gehovert wird--*/
#menu ul ul {
position: absolute;
z-index: 2;
display: none;
}
/*--lässt die Dropdown-Links beim Hovern erscheinen--*/
#menu ul li:hover ul {
display: block;
}
/*--nur für IE-Versionen kleiner gleich 6 erkennbar--*/
* html #menu ul li {
float: left;
width: 100%;
}
/*--nur für IE 7 erkennbar--*/
*+ html #menu ul li {
float: left;
width: 100%;
}
</style>
<script type="text/javascript" src="include/designs/DDvXdr/jquery.min.js"></script>
</head>
<body>
<!-- Teamspeak Slider ANFANG //-->
<div id="ts_slider" class="ts_slider" style=" right: 0px; width: 300px; position: fixed; top:100px; background:url(include/designs/DDvXdr/Bilder/TS3bar.png) repeat scroll 0% 0% transparent; height: 506px; z-index: 999;" >
<div style="position:absolute;top:27px;left:60px;width:2306px;height:447px;overflow:auto; color:#ffffff;">
<div id="ts3viewer_106808" style="width:; background-color:;"> </div>
<script type="text/javascript" src="http://static.tsviewer.com/short_expire/js/ts3viewer_loader.js"></script>
<script type="text/javascript">
<!--
var ts3v_url_1 = "http://www.tsviewer.com/ts3viewer.php?ID=106808&text=fcfcfc&text_size=11&text_family=1&js=1&text_s_weight=bold&text_s_style=normal&text_s_variant=normal&text_s_decoration=none&text_s_color_h=db042f&text_s_weight_h=bold&text_s_style_h=normal&text_s_variant_h=normal&text_s_decoration_h=underline&text_i_weight=normal&text_i_style=normal&text_i_variant=normal&text_i_decoration=none&text_i_color_h=db042f&text_i_weight_h=normal&text_i_style_h=normal&text_i_variant_h=normal&text_i_decoration_h=underline&text_c_weight=normal&text_c_style=normal&text_c_variant=normal&text_c_decoration=none&text_c_color_h=db042f&text_c_weight_h=normal&text_c_style_h=normal&text_c_variant_h=normal&text_c_decoration_h=underline&text_u_color=db042f&text_u_weight=bold&text_u_style=normal&text_u_variant=normal&text_u_decoration=none&text_u_color_h=db042f&text_u_weight_h=bold&text_u_style_h=normal&text_u_variant_h=normal&text_u_decoration_h=none";
ts3v_display.init(ts3v_url_1, 106808, 100);
-->
</script>
</div>
</div>
<script type="text/javascript">
var state = 0;
var wait = false;
function changeSlider()
{
if(state==0){
$('#ts_slider').animate({width: 40 }, "slow", function(){});
}
else
$('#ts_slider').animate({width: 300 }, "slow", function(){});
wait = false;
}
$('#ts_slider').mouseenter(function(event){
if(state==0)
{
state =1;
changeSlider();
wait = true;
setTimeout('changeSlider();',2000)
}
if(wait)
state = 1;
})
$('#ts_slider').mouseleave(function(){
state = 0;
if(!wait)
changeSlider();
});
</script>
<br />
<!-- Teamspeak Slider ENDE //-->
<center>
<table width="1100" border="0" cellpadding="0" cellspacing="0">
<tr>
Betroffende Page:
externer Link