Fade effect left to right on a image

Question

I have fade effect structure. With the following:

  <img src='firstStar.jpg' alt='star image' id='firstStar' />

    var loopImages = function(){

         $('#firstStar').fadeIn(1500, function(){

                   $('#firstStar').fadeOut(1500, loopImages);           
         });
    }
    loopImages();

It's working. But i want, this effect get left to right. Is it possible?

Is it something like http://stackoverflow.com/questions/596608/slide-right-to-left — Max, Jan 07 '13 at 09:29

score 4 · Answer 1 · answered Jan 07 '13 at 09:27

4

You can try with this, I used to work with it on my previous project.

http://jonobr1.github.com/diagonalFade/

Hope it fits your needs.

Regards.

answered Jan 07 '13 at 09:27

semir.babajic

731
3
9

score 3 · Accepted Answer · answered Jan 07 '13 at 09:29

3

You can try something like this with animate

$(document).ready(function(){
    $("#firstStar").animate({left:200, opacity:"show"}, 1500);
});

Make sure the div is initially hidden (style="display:none;").

answered Jan 07 '13 at 09:29

Alessandro Minoccheri

35,521
22
122
171

Vikram · Answer 3 · 2014-06-10T21:40:04.710

0

By 'But i want, this effect get left to right', do you mean to refer this one?

http://www.oik-plugins.com/wordpress-plugins-from-oik-plugins/wordpress-plugins/oik-nivo-slider/nivo-settings/nivo-slider-transition-effects/nivo-slider-effectslicedownright/

If yes, then you can use the effect called as sliceDownRight.

edited Jun 10 '14 at 21:40

answered Jun 10 '14 at 21:20

Vikram

3,996
8
37
58

Fade effect left to right on a image

3 Answers3

Linked