SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Addict SwordsmanX's Avatar
    Join Date
    Sep 2005
    Posts
    211
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need help with a clever CSS + Javascript trick

    I'm trying to get a DIV, and after 2 seconds start fading it (setting its opacity increasingly lower). When it's totally faded, I will remove the innerHTML of the element leaving it empty

    The code I'm currently using works only on firefox, and it's this

    Code:
    document.getElementById(id).style.opacity=1;
    setTimeout("c=setInterval('document.getElementById(\""+id+"\").style.opacity-=0.025',25)",2000);
    setTimeout("document.getElementById('"+id+"').innerHTML='';clearInterval(c);",3100);
    Now onto the tricky question
    I know from my CSS lore that the corresponding IE style to get 50% opacity is:
    filter: alpha(opacity=50); (instead of FF's opacity:0.5)

    How can I use this to insert a second setTimeout for IE's opacity?
    (similar to setTimeout("c=setInterval('document.getElementById(\""+id+"\").style.opacity-=0.025',25)",2000);
    )
    I would ideally need to decrease by 2.5, every 50 milliseconds, the value in filter: alpha(opacity=50);

    Thanks

  2. #2
    SitePoint Addict jtrelfa's Avatar
    Join Date
    Oct 2004
    Location
    Troy, Mi
    Posts
    231
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just a note: settimeout will allow any function or action after it to be called while it waits - so you can't always count on things finishing at the same time

    IE's filters can be a fickle thing. If you peek into the inner workings of scriptaculous, you'll see how fading is handled cross-browser like. There's some older documentation on MDSN regarding filters - you can actually set timings within the CSS:

    http://msdn.microsoft.com/library/de...lter_entry.asp
    var me = null;

  3. #3
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    For another reference, have a look at xOpacity.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •