HTML:
<?php
?>
<!DOCTYPE HTML>
<html>
<head>
<title>Silverworx Nederland | Home</title>
<link rel="stylesheet" type="text/css" href="style.css">
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="ie-style.css">
<![endif]-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.slideshow2.js"></script>
<?php
include "inc/tags.php"
?>
</head>
<body>
<div id="body">
<div id="wrap">
<div id="image1">
<img src="images/slide1.jpg" width="100%" height="375">
</div>
<div id="image2">
<img src="images/slide2.jpg" width="100%" height="375">
</div>
<div id="image3">
<img src="images/slide3.jpg" width="100%" height="375">
</div>
<div id="image4">
<img src="images/slide4.jpg" width="100%" height="375">
</div>
<div id="image5">
<img src="images/slide5.jpg" width="100%" height="375">
<div id="previous"></div>
<div id="next"></div>
</div>
<div id="image6">
<img src="images/slide6.jpg" width="100%" height="375">
</div>
</div>
</div>
</body>
</html>[js]
$(function(){
setInterval(function(){
$('#wrap :first-child').fadeOut()
.next('img').fadeIn()
.end('img').appendTo('.fadein');},
3000);
});
[/js]
Dit is een HTML en een Javascript bestand.
Weet iemand hoe ik er voor zorg dat niet de afbeeldingen maar de divs in en uit faden?
Ik wil dat omdat ik dan later in de div's een balk kan zetten met info erin die de images moeten overlappen.
Ik had zelf al geprobeerd om op de plekken van 'img', 'div' in te vullen, maar dat hielp helaas niet, dan fade alleen de 1e div uit en dan stopte het.
