http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect en-us 40 <p class="credits"><img style="width:600px;" src="http://blog.randomutterings.com/images/articles/gallery.png"><br>Photo by <a href="http://www.flickr.com/photos/randomutterings/">me!</a></p> <p>It took me a bit of digging to figure out how to fade out a picture, change the src, then fade it back in. I started out trying to use Scriptaculous but I got stuck trying to get the queue setup to wait until the image was faded out to change the src. I ended up using jQuery which also gave me a bonus, the solution is unabtrusive.</p> <p>Here are the application.js and show.html.haml files from my project.</p> <script src="http://gist.github.com/64723.js"></script> Sun, 15 Feb 2009 10:14:00 +0000 urn:uuid:3c3f2d0f-45b6-4208-8135-cb9a144b2694 Chris Barnes http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect Ruby on Rails Javascript ruby rails Javascript JQuery http://blog.randomutterings.com/articles/trackback/32 for some reasons i got an error and delay while loading multiple images... use $("#medium_photo").attr('src',src).unbind(); after loading is complete Tue, 26 Jul 2011 12:13:15 +0000 urn:uuid:fc1fd0d4-d588-41a5-85ca-73aa828061bf http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect#comment-6717 Thanks, I was looking for that. I'm also looking for a way to make the image change automatically. Fri, 17 Jun 2011 07:40:46 +0000 urn:uuid:4c45975b-b428-4e18-8634-0fe001333c03 http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect#comment-6651 I clicked on the thumbnails above, but noticed no change on the big image. Please look into it. Mon, 13 Jun 2011 16:30:49 +0000 urn:uuid:1493bbd2-e796-4b96-a909-48d28fb47efd http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect#comment-6639 Hello Friend,Whichever style of Fashion Shoes you're looking for, classical, fashionable, lovely or the latest design, you can find your favorite designer shoes in <a href="http://www.dunkpage.com" rel="nofollow">www.dunkpage.com</a> ,several days ago I bought one pair of shoes from there,It's beautiful and very comfortable! Fri, 10 Jun 2011 14:16:08 +0000 urn:uuid:e9b83ef3-73a8-42ab-a625-fa429540aaac http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect#comment-6635 I am profoundly grateful, touched by the great distinction and honor and great compliment accorded me by the authorities of Harvard this morning. I am overwhelmed, as a matter of fact, and I am rather fearful of my inability to maintain such a high rating as you've been generous enough to accord to me. In these historic and lovely surroundings, this perfect day, and this very wonderful assembly, it is a tremendously impressive thing to an individual in my position.<a href="http://www.tiffanyandcooutlet.net/" rel="nofollow">tiffany and co outlet</a> Tue, 12 Apr 2011 01:36:50 +0000 urn:uuid:40a7e99b-02f5-429f-9618-3352d4caecaa http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect#comment-6422 Don’t stop writing, you’ve given me lots of good info! Wed, 27 Jan 2010 03:06:34 +0000 urn:uuid:c62e6e95-08a6-47ed-9e84-b78f451b04ac http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect#comment-5382 Thanks from Brazil ;) Wed, 14 Oct 2009 13:25:56 +0000 urn:uuid:9b3f4a99-0e81-453c-b145-6e2fd7243fba http://blog.randomutterings.com/articles/2009/02/15/changing-images-with-jquery-and-the-fade-effect#comment-4963