December 1st, 2012, 02:29 PM
|
|
Registered User
|
|
Join Date: Dec 2012
Posts: 1
Time spent in forums: 24 m 7 sec
Reputation Power: 0
|
|
|
Frustration with jquery image slider
I'm sure it is something dumb, but so irritating!!
I have this very simple page with an image slider on it. It works fine, first image fades in, slides to second image. Stops. Doesn't do anything, just hangs on the second image and doesn't go to the third. WHAAATTT?! I can't figure out what I did wrong, anyone see the error?
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<title>Kal Web Design</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script type="text/javascript">
function Slider() {
$(".slider #1").show("fade", 500);
$(".slider #1").delay(5500).hide("slide", {direction:'left'}, 500);
var sc = $(".slider img").size();
var count = 2;
setInterval(function (){
$(".slider #"+count).show("slide", {direction:'right'}, 500);
$(".slider #").delay(5500).hide("slide", {direction:'left'}, 500);
if(count == sc){
count = 1;
}else{
count = count + 1;
}
},6500);
}
</script>
</head>
<body onload="Slider();">
<div class="nav">
<ul>
<li><a href="google.com">About</a></li>
<li><a href="google.com">Contact</a></li>
<li><a href="google.com">Services</a></li>
<li><a href="google.com">Work</a></li>
</ul>
</div>
<div id="logo"><img src="KWDlogo.png" /></div>
<div class="sliderBG">
<div class="sliderArea">
<div class="slider">
<img id="1" src="test1.png"></img>
<img id="2" src="test2.png"></img>
<img id="3" src="test3.png"></img>
</div>
</div>
</div>
</body>
</html?
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
