hjälp med rullande bildspelsheader javascript/html/css.
Hej jag håller på med en hemsida och har ett litet problem.
Det är så att under min header har jag ett bildspel där bilderna byts ut var tredje sekund.
Det jag stör mig på är dock varje gång man klickar på någon länk i menyn typ Hem/info/kontakt osv så går bildspelet tillbaka till den första bilden.
Jag skulle vilja att bildspelet under headern rullar på oavsett vilken del av sidan man är inne på alternativt att den slumpar vilken bild som kommer upp när man trycker på någon länk i menyn. Att göra så det slumpas vet jag ju hur man gör "manuellt" eller vad man säger, alltså att man byter bild automatiskt i varje sidas kod men finns det något annat kommando så man kan ändra i template?
Hoppas ni förstår vad jag menar och har ni något tips så är det jätte uppskattat!
Här nedan kommer javascriptet, html-koden och css-koden om någon skulle vilja se hur det ser ut.
Javascript:
<script src="jquery-1.4.2.min.js" type="text/javascript">< /script>
<script src="s3Slider.js" type="text/javascript">< /script>
<script type="text/javascript">
$(d ocument).ready(function() {
$('#s3slider').s3S lider({
timeOut: 3000
});
});
</script>
HTML-KODEN:
<div id="subbanner">
<div id="s3slider">
<ul id="s3sliderContent">
<li class="s3sliderImage">
<img src="headerbild copy.jpg" />
<span></span>
</li>
<li class="s3sliderImage">
<img src="headerbild2 copy.jpg" />
<span></span>
</li>
<li class="s3sliderImage">
<img src="headerbild3 copy.jpg" />
<span></span>
</li>
<li class="s3sliderImage">
<img src="headerbild4 copy.jpg" />
<span></span>
</li>
<li class="clear s3sliderImage"></li>
</ul>
CSS-KODEN:
#subbanner { width:900px; height:200px; background-image:url(../bilder /headerbild%20copy.jpg); background-repeat:no-repeat; }
width:950px;
height:300px;
position:relative;
overflow:h idden;
}
#s3sliderContent {
width:950px;
height:300px;
position:absolute;
top:0;
mar gin-left:0;
}
.s3sliderImage {
float:left;
position:relat ive;
display:none;
}
.clear {
clear:both;
}
