jQuery background-image animation -


How do I animate between two PNG images in jQuery? Is this possible?

Something like CSS 3 infection when you move between one color to the other, but I want an image transition image.

Check this plugin by Jack Moore.

EDIT: Chooses two images, sorry. How about?


Okay, if you are not happy with the plugin then try it. I posted a

CSS / HTML

  style style = "text / css" & gt; . Wrap {margin: 50px auto; Width: 200px; Height: 200 pixels; Background: # 555; Status: Relative; } .display1, .display2 {status: complete; Top: 0; Left: 0; } & Lt; / Style & gt; & Lt; Div class = "wrap" & gt; & Lt; Div class = "display1" & gt; & Lt; / Div & gt; & Lt; Div class = "display2" & gt; & Lt; / Div & gt; & Lt; / Div & gt;  

script

  $ (document) .ready (function () {var bkgImgs = ((([['http://i50.tinypic.com / '2iiz9cm.gif', 86, 86], ['http://i45.tinypic.com/dop26e.png', 128, 128], ['http://i48.tinypic.com/xcosnq.png', 64, 64]] var delay = 5000; var transition = 1000; var i = 0; var l = bkgImgs.length-1; imgs = function (x) {return {background: 'url (' + bkgImgs [x] [0] + ') No-repeat center center, width: BKGIMG [x] [1], height: bkgimgas [x] [2], left: $ (' rap '). Width () / 2 - BKGIMG [ X] [1] / 2, top: $ ('rap'). Height () / 2 - bkgimgas [x] [2] / 2}} next = function () {var oldp Ic = imgs (i); i ++; if (i> l) i = 0; var newpic = imgas (i); $ ('display2') .css (old). Show (); $ ('. Display 1'). Hide () CDS (nuPic) .Fedine (transition); $ ('display2') .Fedhat (transition); setimimate (function () {next ()}, delay);} Next ();})  

Comments

Popular posts from this blog

oracle - The fastest way to check if some records in a database table? -

php - multilevel menu with multilevel array -

jQuery UI: Datepicker month format -