#1
  1. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Mar 2008
    Posts
    657
    Rep Power
    38

    Animating opacity with jQuery


    I'm trying to animate the opacity of an image over about 2 seconds of time.
    I set the "opacity" in the css to 0 and tried to transform the opacity to 100 using jQuery.
    I did some research and noticed a lot of differentiations for different browsers.
    Is there an easy was to do this? I could not figure it out.

    Any ideas etc. are appreciated.
    thanks
  2. #2
  3. No Profile Picture
    Lost in code
    Devshed Supreme Being (6500+ posts)

    Join Date
    Dec 2004
    Posts
    8,317
    Rep Power
    7170
    Something like this should do it:
    Code:
    $('#element').animate({opacity: 1}, 2000);
    There's an example of animating opacity on the documentation page for the animate function.
    PHP FAQ

    Originally Posted by Spad
    Ah USB, the only rectangular connector where you have to make 3 attempts before you get it the right way around
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Mar 2008
    Posts
    657
    Rep Power
    38

    thanks E-Oreo


    your solution worked great!!

    thanks again
  6. #4
  7. --
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2012
    Posts
    3,957
    Rep Power
    1046
    Hi,

    there's fadeIn() for exactly this purpose.
    The 6 worst sins of security ē How to (properly) access a MySQL database with PHP

    Why canít I use certain words like "drop" as part of my Security Question answers?
    There are certain words used by hackers to try to gain access to systems and manipulate data; therefore, the following words are restricted: "select," "delete," "update," "insert," "drop" and "null".
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Mar 2008
    Posts
    657
    Rep Power
    38

    thanks Jacques1


    I found the precious work around a little buggy. I will test your idea soon.

    thanks again!!

IMN logo majestic logo threadwatch logo seochat tools logo