Bug Tracker

Opened 11 years ago

Closed 11 years ago

#4027 closed bug (invalid)

Animate src bug on Safari and Chrome

Reported by: EricGagnon Owned by:
Priority: minor Milestone: 1.3.2
Component: effects Version: 1.3.1
Keywords: Cc:
Blocked by: Blocking:

Description

First of all, a big thanks to everyone working on jQuery for making this library a real masterpiece. I really enjoy your work!

For the bug: I was trying to make a slideshow by making a picture fadeOut, change src, and then re-appear. So I used animation "stacking":

$('#avant_img').fadeOut();

$('#avant_img').animate(

{

src: 'images/realisations/'+(realisation++)+'b.jpg'

}, 0);

$('#avant_img').load(function(){$('#avant_img').fadeIn();});

It works on IE6, IE7, FF3, Opera but doesn't work on Safari and Chrome. The 'src' attribute is just never changed.

Btw, I found a way to solve this bug, but it is not quite elegant:

$('#avant_img').animate(

{

src: 'images/realisations/'+(realisation++)+'b.jpg'

}, 0, function(){$('#avant_img').attr('src','images/realisations/'+(realisation)+'b.jpg');});

Change History (5)

comment:1 Changed 11 years ago by aaron.gundel

http://docs.jquery.com/Effects/animate The documentation states that animate is used for modifications to style properties, not attributes. I suspect that is the issue here.

comment:2 Changed 11 years ago by EricGagnon

Yeah, but it does work on everything except Safari and Chrome. So this is a compatibility problem!

comment:3 Changed 11 years ago by dmethvin

Right, but as aaron says, this is not a supported use of {{{.animate()}}. There are other ways of changing the image src attribute/property via the callback. Did you need some help in reworking the code to do that?

comment:4 Changed 11 years ago by EricGagnon

I guess it might be something like:

$('#avant_img, #apres_img').fadeOut('slow',function(){

$('#avant_img').attr('src','images/realisations/'+(realisation)+'b.jpg'); $('#apres_img').attr('src','images/realisations/'+(realisation)+'a.jpg');

}); $('#avant_img, #apres_img').load(function(){$('#avant_img, #apres_img').fadeIn();});

I've submitted the bug because sometimes a little bug may hide a bigger one... So i just wanted to let you know guys!

comment:5 Changed 11 years ago by dmethvin

Resolution: invalid
Status: newclosed

Okay, cool. Sounds like you have it figured out so I'll close the ticket.

Note: See TracTickets for help on using tickets.