Infinite Loop matter !
Infinite Loop matter !
Hello I've got some matters with my infinite loop function on a website I've built.
Since some days, the loop doesn't loop at all. It stays fixed on the first image.
here is the url to the website.
laurevangaver.fr
I am pretty rubbish concerning the html code , so if you can help me, that would be great . Especially since it's pretty urgent, and my customer Needs to show her work fast enough!
And here is my code for this page :
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Laure Van Gaver - Architecte d'intérieur - Paris</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="media/css/reset.css" type="text/css">
<link rel="stylesheet" href="media/css/style.css" type="text/css">
<link rel="SHORTCUT ICON" href="favicon.ico" type="image/x-icon">
<style>
#picOne, #picTwo, #picThree, #picFour, #picFive, #picSix {
display:none;
position:absolute;
width:835px;
left:0%;
margin-top:130px;
margin-left:130px;
}
#pics {
width:50%;
}
#imgfond {
position:static;
width:835px;
margin-left:122px;
padding-top: 130px;
}
</style>
<script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
function runPics(){
$('#picOne').delay(0).fadeIn(2000,function(){
$('#picTwo').delay(0).fadeIn(2000,function(){
$('#picThree').delay(0).fadeIn(2000,function(){
$('#picFour').delay(0).fadeIn(2000,function(){
$('#picFive').delay(0).fadeIn(2000,function(){
$('#picOne').delay(0).fadeOut(2000)
$('#picTwo').delay(0).fadeOut(2000)
$('#picThree').delay(0).fadeOut(2000,function(){
$('#picFour').delay(0).fadeOut(2000,function(){
$('#picFive').delay(0).fadeOut(2000,function(){
$('#picOne').attr({src:'media/wrapper/boutique-835x438.jpg'})
runPics();
})
})
})
})
})
})
})
})
};
runPics();
});
</script>
</head>
<body>
<div id="wrap" class="de">
<div id="head">
<h1><a href="index.html">Laure Van Gaver - Architecte d'intérieur - Paris</a></h1>
<ul id="nav" style="list-style-type:none">
<li class="particuliers"><a href="fr/fr.part.html">Particuliers</a></li>
<li class="boutiques"><a href="fr/fr.bout.html">Boutiques</a></li>
<li class="faillant"><a href="fr/fr.partenariats.html">Partenariats - Faillant Dumas</a></li>
<li class="contact"><a href="fr/fr.contact.html">Contact</a></li>
<li class="lang"><a href="en/index.html">Language</a></li>
</ul>
</div>
<div id="pics">
<img src="media/wrapper/boutique-835x438.jpg" width="50%" id="picOne" />
<img src="media/wrapper/particuliers1-835x438.jpg" width="50%" id="picTwo" />
<img src="media/wrapper/particuliers2-835x438.jpg" width="50%" id="picThree" />
<img src="media/wrapper/particuliers3-835x438.jpg" width="50%" id="picFour" />
<img src="media/wrapper/particuliers4-835x438.jpg" width="50%" id="picFive" />
</div>
<div id="imgfond">
<img src="media/wrapper/boutique-835x438.jpg"/>
</div>
</body>
</html>
<!-- Localized -->