Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    375
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Firefox Continuous Loading

    I've written a somewhat complex script that includes image rollovers for a snazzy looking interface as you mouse over options. It works fine in IE6. Also fine in Firefox except that at certain times when the images are being rolled over, Firefox will act like it is loading a page (disc spins, load progress bar gets pinned at full and stays highlighted). The images have already long ago been cached at this point, there are only two very small ones involved. I'm looking for a method (similar to document.close() or something) that I could use after each rollover to get Firefox to stop this nonsense or some insight into what might be causing it to happen in the first place. Any ideas? I'm afraid the code will not make much sense without the markup which, is extensive (link to demo follows code). The code may provide some sharp javascript guru with enough to spot what's causing this though, so here it is (the offending function appears to be 'swapImage'):
    Code:
    /*  John Davenport Scheuer */
    
    var containerPage='3col.htm'
    var masterList='page1.htm'
    var midPlace='page2.htm'
    var endBlank='page3.htm'
    var endPlace='page4.htm'
    var offArrow='bluearrow.gif'
    var onArrow='whitearrow.gif'
    
    function restoreA(){
    var links=document.getElementsByTagName('a');
    for (var i =0; i<links.length ; i++){
    if (links[i].className=='clicked'||links[i].className=='oldClicked'){
    links[i].className='list'
    swapImage(links[i].innerHTML,offArrow)
    }
    }
    }
    
    function restoreB(){
    parent.frame1.grayOut()
    var links=document.getElementsByTagName('a');
    for (var i =0; i<links.length ; i++){
    if (links[i].className=='clicked'){
    links[i].className='list'
    swapImage(links[i].innerHTML,offArrow)
    }
    }
    }
    
    function grayOut(){
    var links=document.getElementsByTagName('a');
    for (var i =0; i<links.length ; i++){
    if (links[i].className=='clicked'){
    links[i].className='oldClicked'
    }
    }
    }
    
    function swapImage(elm,img){
    var tmpStr=elm.substr(elm.indexOf('name='))
    document.images['ar'+parseInt(tmpStr.substr(tmpStr.indexOf('ar')+2))].src=img
    }
    
    function init() {
    if (location.href.indexOf(containerPage)!==-1)
    init1();
    else if (location.href.indexOf(masterList)!==-1)
    init2();
    else
    init3();
    }
    
    function init1() {
    if (frame1.location.href.indexOf(masterList)==-1)
    frame1.location.replace(masterList);
    if (frame2.location.href.indexOf(midPlace)==-1)
    frame2.location.replace(midPlace);
    if (frame3.location.href.indexOf(endBlank)==-1)
    frame3.location.replace(endBlank)
    }
    function init2() {
    var links=document.getElementsByTagName('a');
    for (var i =0; i<links.length ; i++){
    if (links[i].className=='list'){
    links[i].onmouseover=function(){
    swapImage(this.innerHTML,onArrow)
    }
    links[i].onmouseout=function(){
    if (this.className=='list')
    swapImage(this.innerHTML,offArrow)
    }
    links[i].onclick=function(){
    restoreA();this.className='clicked';
    swapImage(this.innerHTML,onArrow)
    if (parent.frame3.location.href.indexOf(endBlank)!==-1)
    parent.frame3.location.replace(endPlace);
    parent.frame2.location.replace(this.href);return false
    }
    }
    }
    }
    
    function init3() {
    var links=document.getElementsByTagName('a');
    for (var i =0; i<links.length ; i++){
    if (links[i].className=='list'){
    links[i].onmouseover=function(){
    swapImage(this.innerHTML,onArrow)
    }
    links[i].onmouseout=function(){
    if (this.className=='list')
    swapImage(this.innerHTML,offArrow)
    }
    links[i].onclick=function(){
    restoreB();this.className='clicked';
    swapImage(this.innerHTML,onArrow)
    parent.frame3.location.replace(this.href);return false
    }
    }
    }
    }
    
    window.onload=init;
    Last edited by jscheuer1; 07-10-2005 at 04:07 PM.

  • #2
    Regular Coder
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    375
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I know this is a heavy case so, I added a link to a demo at the end of the original post. (bump)

  • #3
    Regular Coder
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    375
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hopefully, this will be my last attempt at bumping this subject to get a response. My original link to a demo of this problem is on a site that is probably too slow for evaluation purposes so, I've taken out one of these free, ad supported sites, that seems fast enough for demo purposes, the new link is:

    3 Column Demo

    I'd really love to fix its odd loading behavior in FF or at least have some feedback on it.

    To reiterate, what happens in FF (and probably Mozilla in general) is that after you make your first selection by clicking on an option in the leftmost column and then mouseover other selections in that column, the load disk spins and the load progress bar acts like it is loading a page. I want to stop this behavior if possible.
    Last edited by jscheuer1; 07-18-2005 at 12:43 PM.

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,965
    Thanks
    0
    Thanked 236 Times in 233 Posts
    I don't know if this is related to FF continuous loading but why are the links absolutely positioned when the left, right, top, bottom properties are not set?

  • #5
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    I know you may have thought of this, but its worked for me before. Have you tried preloading the images you are using?

  • #6
    Regular Coder
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    375
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I found that in order to have them line up properly with the absolutely positioned arrows (which did seem to need a right coordinate specified), giving them that property achieved this. I suppose there may be another way. I stopped experimenting soon after I found a method that worked in IE and Mozilla. I can try it without any style just to see what happens, it will look odd, to say the least but, will rule the style in or out as a cause. Done! Not the source of this odd behavior. Another interesting part of this puzzle is that if you click on another selection, taking care not to mouseover onto its neighbors on the same page, the loading behavior stops. You can even carefully guide the mouse over to the center column without it starting again until you mouseover and out a link in the center column or (rarely) simply mouseover it.

    Oh and, thanks for having a look!

  • #7
    Regular Coder
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    375
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have tried preloading the images but, I'm willing to try again. Any particular method you would suggest? I used something like this:

    image1=new Image()
    image1.src="whitearrow.gif"
    image2=new Image()
    image2.src="bluearrow.gif"

    Then wherever the images were called for in the script I used image1.src in place of whitearrow.gif and similarly for bluearrow.gif


  •  

    Posting Permissions

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