Flash, Javascript Time Conflict in Internet Explorer

Discussion in 'Javascript' started by mudgen, Sep 28, 2007.

  1. mudgen

    mudgen Guest

    I have a webpage that has two flash animations running. I also have a
    javascript script running that rotates 3 images and fades them in and
    out. To do the fading and rotating in javascript I am using the
    setInterval function, like this:

    setInterval(function () {imageFade()},10);


    This works fine in Firefox, but in IE 7, the flash animations slow
    down a lot, and the javascript fading/rotation slows down some.

    There seems to be a timing conflict in IE 7 between flash and
    javascript. Any suggestions on how to fix this in IE 7?
     
    mudgen, Sep 28, 2007
    #1
    1. Advertisements

  2. mudgen

    David Mark Guest

    What does this imageFade function look like and why call it a hundred
    times per second?
     
    David Mark, Sep 28, 2007
    #2
    1. Advertisements

  3. mudgen

    Stevo Guest

    One thing that might be happening is that calling your imageFade
    function every 10 milliseconds isn't leaving enough time for everything
    to run. You could try making some measurements. Make a note of the time
    at the start of your imageFade and also at the end. You might find it's
    close to 10ms. It's for this reason that I never use setInterval with a
    short time. For me, if the time is less than a second, then I usually
    prefer to use setTimeout, and put a setTimeout at the end of your
    function for the next call. By using setTimeout, you're guaranteeing a
    certain amount of "free time" until the next call. There's no perfect
    solution, the browser environment is a controlled sandbox and things run
    only as fast as allowed when the overhead of that environment being
    managed is also accounted for.
     
    Stevo, Sep 28, 2007
    #3
  4. No OS timer ticks in 10-millisecond intervals.
    Don't use setInterval() for time-critical applications; use setTimeout()
    instead. Google is your friend. [psf 6.1]


    PointedEars
     
    Thomas 'PointedEars' Lahn, Sep 28, 2007
    #4
  5. mudgen

    mudgen Guest

    the imageFade function looks like this:

    function imageFade(){

    if (image_action == "increase") {
    if(image_opacity <= 8)
    image_opacity += 0.04;
    else {
    image_action = "decrease";
    }
    }

    if (image_action == "decrease") {
    if(image_opacity >= .1)
    image_opacity -= 0.06;
    else {
    image_action = "increase";
    image_num++;
    setImage(image_num);
    if (image_num >= image_total)
    image_num = -1;
    }
    }
    document.getElementById("image_alpha").style.KhtmlOpacity =
    image_opacity;
    document.getElementById("image_alpha").style.MozOpacity =
    image_opacity;
    document.getElementById("image_alpha").style.opacity = image_opacity;
    document.getElementById("image_alpha").style.filter =
    'alpha(opacity=' + 100 * image_opacity + ')';
    }
    setInterval(function () {imageFade()},10);
     
    mudgen, Sep 28, 2007
    #5
  6. mudgen

    David Mark Guest

    What does that mean?
    You just wiped out any other filters.
    Again, why 100 times per second? Adjust the opacity increment amd try
    it at 60 times per second. Can your eyes perceive any difference?
    Then try it at 30.

    As for efficiency, look at how many times you queried for
    image_alpha. Also, see my recently posted set_opacity example as you
    are doing four times as much work as needed to set the opacity of the
    element.
     
    David Mark, Sep 28, 2007
    #6
  7. mudgen

    mudgen Guest

    Thanks, where is your set_opacity example?
     
    mudgen, Sep 29, 2007
    #7
  8. mudgen

    mudgen Guest

    By default are there filters?
     
    mudgen, Sep 29, 2007
    #8
  9. If the frame length of the animation should be 10 milliseconds, yes.


    PointedEars
     
    Thomas 'PointedEars' Lahn, Sep 29, 2007
    #9
  10. In comp.lang.javascript message <>, Fri,
    That's rather a strong statement; are you sure that you know about EVERY
    OS - or even every one that supports Javascript?

    ISTR reading that the Win98/WinXP timer, while running by default at
    64Hz, can be set by a program to run at other speeds; and that the new
    speed will be maintained whilst that other program continues to run. I
    don't assert that as a proven fact, though.
     
    Dr J R Stockton, Sep 29, 2007
    #10
  11. OK, let's just say that I find it unlikely that any HTML UA ticks that fast
    or that such low values are even implemented by setTimeout(). Given the
    current Gecko code and the Bugzilla material found so far, I have to assume
    that the earliest implementations already normalized the time value to
    prevent the OS from hanging:

    https://bugzilla.mozilla.org/show_bug.cgi?id=123273


    PointedEars
     
    Thomas 'PointedEars' Lahn, Sep 29, 2007
    #11
  12. mudgen

    David Mark Guest

    [snip]
    Not by default.
     
    David Mark, Sep 30, 2007
    #12
  13. mudgen

    mudgen Guest

    My question is, why does it work fine in Firefox and not in IE? How
    can I make it work in IE too? I switched setInterval to setTimeout,
    but there is not difference in performance in IE.
     
    mudgen, Oct 2, 2007
    #13
  14. That would depend on the code you are using now, which you have not posted.


    PointedEars
     
    Thomas 'PointedEars' Lahn, Oct 2, 2007
    #14
  15. mudgen

    mudgen Guest

    mudgen, Oct 2, 2007
    #15
  16. mudgen

    mudgen Guest

    Thanks a lot for your help. I figured some stuff out. Like instead
    of just calling setTimeout with 10 milliseconds, also call it with
    4000 seconds for when I want a picture to stay there for awhile
    without fading.
     
    mudgen, Oct 2, 2007
    #16
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.