SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Javascript Conflict in IE but not FF

    I believe that I am having a conflict between two javascripts.

    The site is done in Joomla and the conflict is between a manual scrolling script from dynamic drive and image rotating module.

    The page with the manual scroller is located here: http://www.site.3ozproductions.com/i...d=18&Itemid=32

    the scrolling text works fine until I turn on the frontpage slideshow here:
    http://www.site.3ozproductions.com/i...=72&Itemid=139

    The conflict only occurs in IE 6 and IE 7 (not FireFox)

    I believe that the FrontPage slideshow is using mootools

    Here is the code for the scrolling text script:
    http://www.dynamicdrive.com/dynamici...nualscroll.htm

    I am not attached to the dynamic drive script if someone knows of a different manual scrolling script I am more than willing to try it out.

    I wish I knew more about Javascript and I am willing to learn. All comments are greatly appreciated!

    Thanks in Advance!

  2. #2
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,053
    Mentioned
    187 Post(s)
    Tagged
    2 Thread(s)

    settimeout

    Do both scripts use setTimeout? If so this could be a real problem.

  3. #3
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    They both do use setTimeout. What do I need to do to fix this? I will start searching and post what I find.

    Thanks for pointing this out!

    Any help is greatly appreciated!

  4. #4
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is a code that I am using for the text scrolling script.

    Are there some other improvements that I can make to bring this script more up to date?

    Thanks for all the help as I continue to learn more about JavaSript!

    Code:
    <!-- hide script from old browswer
    //This is the script that handles the scroll up and down
    
    
    if (iens6){
    document.write('</div></div>')
    var crossobj=document.getElementById? document.getElementById("contentscroll") : document.all.contentscroll
    var contentheight=crossobj.offsetHeight
    }
    else if (ns4){
    var crossobj=document.nscontainerscroll.document.nscontentscroll
    var contentheight=crossobj.clip.height
    }
    
    function movedown(){
    if (window.moveupvar) clearTimeout(moveupvar)
    if (iens6&&parseInt(crossobj.style.top)>=(contentheight*(-1)+100))
    crossobj.style.top=parseInt(crossobj.style.top)-speed+"px"
    else if (ns4&&crossobj.top>=(contentheight*(-1)+100))
    crossobj.top-=speed
    movedownvar=setTimeout("movedown()",20)
    }
    
    function moveup(){
    if (window.movedownvar) clearTimeout(movedownvar)
    if (iens6&&parseInt(crossobj.style.top)<=0)
    crossobj.style.top=parseInt(crossobj.style.top)+speed+"px"
    else if (ns4&&crossobj.top<=0)
    crossobj.top+=speed
    moveupvar=setTimeout("moveup()",20)
    }
    
    function stopscroll(){
    if (window.moveupvar) clearTimeout(moveupvar)
    if (window.movedownvar) clearTimeout(movedownvar)
    }
    
    function movetop(){
    stopscroll()
    if (iens6)
    crossobj.style.top=0+"px"
    else if (ns4)
    crossobj.top=0
    }
    
    function getcontent_height(){
    if (iens6)
    contentheight=crossobj.offsetHeight
    else if (ns4)
    document.nscontainerscroll.document.nscontentscroll.visibility="show"
    }
    window.onload=getcontent_height
    
    //end hiding script from old browser -->

  5. #5
    SitePoint Member
    Join Date
    Nov 2006
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try using a global scope with your setTimeout functions.
    Code:
    setTimeout(function() {test();},100);
    Mike - Side project: Live Journal (blogging site).

  6. #6
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you for the reply and I apologize for not knowing more. In my example how would I put your recommendation into place?

    Would this be a line that is put at the top for both the moveup and movedown functions?

    or

    Would I alter the existing moveupvar and movedownvar lines?

    Thanks!

  7. #7
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,053
    Mentioned
    187 Post(s)
    Tagged
    2 Thread(s)

    OK in firefox

    I looked at your first post again. Do both scripts work at the same time in Firefox OK?

  8. #8
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    They do you can see them both working here:

    http://www.site.3ozproductions.com/i...=72&Itemid=139

    The problem is just in Internet Explorer 6 and 7

  9. #9
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have set up different scrolling text script here:
    http://www.site.3ozproductions.com/i...=76&Itemid=147

    This one scrolls fine without the slideshow but turn the slideshow on and I get these errors in firebug on FireFox
    Code:
    this.crossobj has no properties
    moveupp()
    control("up")
    var topint = parseInt (this.crossobj.style.top)
    I changed the moveup function from "moveup" to "moveupp" to ensure this was not part of the problem

    Has anyone seen this type of error?
    Any pointers on which direction to head in?

    Thanks for all the help!

  10. #10
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,053
    Mentioned
    187 Post(s)
    Tagged
    2 Thread(s)

    settimeout

    I noticed that with IE6 I could get the scroll to "twitch" only a little just once when the page first loads in. So I think this is related to the settimeouts. Although I can't figure why it's OK in Firefox and Opera but not IE. IE doesn't throw any javascript errors, it's like the slideshow hijacks the "timer" from the scroller.

  11. #11
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thankyou very much for that.

    I care more about them both working rather that a delay feature for the text scrolling. What would need to be done to remove the timer functions from the scrolling script? Would this solve the problem?

    Just so I am sure the functions that effect the timer are the setTimeout and the clearTimeout. Correct?

    Are you aware of any other alternatives?

    Thanks!

  12. #12
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,053
    Mentioned
    187 Post(s)
    Tagged
    2 Thread(s)

    timer

    Yes those (and some scripts use setInterval) are the timer methods.
    I tried the "notime" page in IE. Even after the slideshow runs a while, mousing over the up arrow twitches the scroll.
    A bit of code to look at and I'm not familiar with it too much yet (It's on my to do list), but when I get a chance I'll look at it more. Hopefully someone with more Moo.fx experience will post.

  13. #13
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile

    Figured out the problem

    It was related to the window.onload line.

    Thanks to everyone that helpded me solve this issue. I has just started to learn about javascript and look forward to learning more!


    You can see the thread here:
    http://www.dynamicdrive.com/forums/s...ad.php?t=19100

    In the end though what is stopping it from working is conflicting window.onload functions.

    Only the last defined onload function will work.

    If you notice I added fpssinit() in the start() function at the end. If you put all onload functions in the start function, they can all be called when 'start' is called in the onload. Then remove the following line from the end of mod_fpslideshow.js

    Code:
    window.onload = fpssinit;


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
  •