[jQuery] Cycle Plugin + Jquery.Preload Plugin
Could one of the javascript gurus please assist me with this?
This works in firefox, but does nothing at all in IE. I have no clue
as to how to make this right:(
<script type="text/javascript">
jQuery(function( $ ){
$('#loading').fadeIn('fast');
$.preload( '#gal img', {//the first argument is a selector to the
images
onRequest:request,
onComplete:complete,
onFinish:finish,
placeholder:'http://farm4.static.flickr.com/
3096/2541727983_352b01f7e8.jpg',//this is the really important option
notFound:'http://farm3.static.flickr.com/
2416/2518341744_55a2ecb9f3.jpg',//optional image if an image wasn't
found
threshold:1 //'1' is the default, how many at a time, to load.
});
function update( data ){
$('#done').html( ''+data.done );
$('#total').html( ''+data.total );
$('#loaded').html( ''+data.loaded );
$('#failed').html( ''+data.failed );
};
function complete( data ){
update( data );
$('#image-next').html( 'none' );//reset the "loading: xxxx"
$('#image-loaded').html( data.image );
};
function request( data ){
update( data );
$('#image-next').html( data.image );//set the "loading: xxxx"
};
function finish(){//hide the summary
$('#loading').fadeOut(500);
$('#gal').fadeIn(1500);
};
$('#gal')
.after('<div id="picnav">')
.cycle({
fx: 'fade',
speed: 800,
pager: '#picnav'
});
$('a#slide-show').mouseover(function() {
$('#slider').show('slow');
return false;
});
$('a#slide-show').mouseout(function() {
$('#slider').fadeOut(2000);
return false;
});
$('#slider').mouseover(function() {
$('#slider').stop();
return false;
});
$('#slider').mouseout(function() {
$('#slider').fadeOut(2000);
return false;
});
});
</script>
Sample at http://photo.byethost22.com/photo/home/sample-gallery-1
Any help at all would be greatly appreciated.