javascript - Rotating Background Image with jQuery -
i trying rotate background image of div jquery. works fine content within div disappears when image rotates. how can prevent content disappering , make such present:
code:
jquery(document).ready(function($) { $(window).load(function() { var =0; var images = ['http://dl.dropboxusercontent.com/u/96099766/changebackgroundjquery/image2.png','http://dl.dropboxusercontent.com/u/96099766/changebackgroundjquery/image3.png','http://dl.dropboxusercontent.com/u/96099766/changebackgroundjquery/image1.png']; var image = $('#slideit'); image.css('background-image', 'url(http://dl.dropboxusercontent.com/u/96099766/changebackgroundjquery/image1.png)'); setinterval(function(){ image.fadeout(1000, function () { image.css('background-image', 'url(' + images [i++] +')'); image.fadein(1000); }); if(i == images.length) = 0; }, 5000); }) });
fiddle here
you can make http://jsfiddle.net/frzssoyw/3/
<div id="slideit"> <div id="slideit-bg"></div> <div id="slideit-content"> content </div> </div>
Comments
Post a Comment