PDA

View Full Version : Image fade in and swap



JCP444
04-17-2011, 10:42 AM
I have this script which swaps an image using a fade.
It repeats. Is there a way to make the event happen only once.
Pretty new to JS, any help would be greatly apppreciated.

<html>

<head>



<script src="jquery.js">

</script>

<script>

function swapImages(){

var $active = $('#myGallery .active');

var $next = ($('#myGallery .active').next().length > 0) ? $('#myGallery .active').next() : $('#myGallery img:first');

$active.fadeOut(function(){

$active.removeClass('active');

$next.fadeIn().addClass('active');

});

}



$(document).ready(function(){



setInterval('swapImages()', 3000);



});















</script>

<style>

#myGallery{

position:relative;

width:100px;

height:40px;

}

#myGallery img{

display:none;

position:absolute;

top:0;

left:0;

}

#myGallery img.active{

display:block;

}

</style>

</head>

<body>

<div id="myGallery">

<img src="finished buttons/blog_on.gif" class="active" />

<img src="finished buttons/blog_off.gif" />



</div>

</body>

</html>