Web Analytics Made Easy -
StatCounter onMouseover in 1 script causes 2nd script to stop - CodingForum

Announcement

Collapse
No announcement yet.

onMouseover in 1 script causes 2nd script to stop

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • onMouseover in 1 script causes 2nd script to stop

    IE ONLY!!!
    Yes, I know my posts are rarely simple (sorry).

    I'm testing the use of two DD scripts along with a ScriptAsylum horizontal scroller. Everything is working rather well with one exception.

    The problem occurs when the user hovers over the "Down/Up" links on the "Scrollable Iframe"...it causes the "Horizontal Scroller" to temporarily stall. I want the "Horizontal Scroller to move continuously (uninterrupted).

    Can anyone see the problem, and/or suggest a solution/fix?

    Yes, I know I have some other JS code, etc. on the page, but I took out the other general content. Sometimes, the other JS is also relevant...but probably not in this case.

    My Test Page
    ...GeoCities is just a testing ground. The page and images are merely for testing...not to look good.

    Scrollable Iframe (DD) -- on the right side (calls an external htm file). This is the one giving me a problem.

    Horizontal Scroller Marquee Replacement (ScriptAsylum) -- scrolls seven "mapped" images at the bottom of the page (pauses onmouseover).

    Gradual-Highlight Image Script II (DD) is applied to images in Horizontal Scroller...should NOT be a factor.
    Gordo
    "In the End, we will remember not the words of our enemies, but the silence of our friends."
    - Martin Luther King Jr. (1929-1968)

  • #2
    if you do a search in the old forum posts, this question comes up very often. you might find your answers there. also, there are tutorials on dynamic drive for using 2 scripts at once.

    Comment


    • #3
      Yes, I'm aware of the old forum posts and the tutorials. However, I cannot locate the problem/conflict. Therefore, it's beyond my coding abilities.

      I've reduced the page to include horizontal marquee and the scrolling iframe only. They are not playing well together. Marquee stops when using the Up/Down links of the iframe.

      MAIN PAGE:
      <html>
      <head>
      </head>
      <body scroll="no" topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
      <tr>
      <td width="25%">

      <!-- SCROLLABLE IFRAME ... BEGIN -->
      <!--Scrollable iframe script- By Dynamic Drive-->
      <!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com-->
      <!--This credit MUST stay intact for use-->
      <iframe id="datamain" style="filter:alpha(opacity=30);" src="iframe_right_side.htm" width="100%" height="260" marginwidth="5" marginheight="5" hspace="0" vspace="0" frameborder="no" border="0" scrolling="no"></iframe>
      <layer visibility=hide>
      <div style="width:100%;" align="center">
      <a href="#" onMouseover="scrollspeed=-2" onMouseout="scrollspeed=0">Up</a> | <a href="#" onMouseover="scrollspeed=2" onMouseout="scrollspeed=0">Down</a>
      </div>
      </layer>
      <!-- SCROLLABLE IFRAME ... END -->

      </td>
      <td width="75%">

      <!-- HORIZONTAL MARQUEE SCROLLER ... BEGIN -->
      <script language="javascript">
      /*******************************************
      Horizontal Scroller (Marquee Replacement) v-1.1
      Brian Gosselin - http://scritpasylum.com
      Version info:
      V-1.0: Initial release.
      V-1.1: Fixed a bug where the content causes parent container element to shrink and grow in NS6.
      *******************************************/

      //ENTER CONTENT TO SCROLL BELOW.
      var content='<nobr><a href="http://www.hotmail.com/" target="_blank" onmouseover="pixelstep=0" onmouseout="pixelstep=4"><img src="1.gif" border="0" width="150" height="112" alt="Hotmail"></a>&nbsp;&nbsp;<a href="http://www.yahoo.com/" target="_blank" onmouseover="pixelstep=0" onmouseout="pixelstep=4"><img src="2.gif" border="0" width="150" height="112" alt="Yahoo"></a>&nbsp;&nbsp;<a href="http://www.ebay.com/" target="_blank" onmouseover="pixelstep=0" onmouseout="pixelstep=4"><img src="3.gif" border="0" width="150" height="112" alt="eBay"></a>&nbsp;&nbsp;<a href="http://www.techtv.com/" target="_blank" onmouseover="pixelstep=0" onmouseout="pixelstep=4"><img src="4.gif" border="0" width="150" height="112" alt="TechTV"></a>&nbsp;&nbsp;<a href="http://www.cnn.com/" target="_blank" onmouseover="pixelstep=0" onmouseout="pixelstep=4"><img src="5.gif" border="0" width="150" height="112" alt="CNN"></a>&nbsp;&nbsp;<a href="http://www.theonion.com/" target="_blank" onmouseover="pixelstep=0" onmouseout="pixelstep=4"><img src="6.gif" border="0" width="150" height="112" alt="The Onion"></a>&nbsp;&nbsp;<a href="http://www.abcnews.com/" target="_blank" onmouseover="pixelstep=0" onmouseout="pixelstep=4"><img src="7.gif" border="0" width="150" height="112" alt="ABC News"></a></nobr>';

      var boxheight=114; //BACKGROUND BOX HEIGHT IN PIXELS.
      var boxwidth=500; //BACKGROUND BOX WIDTH IN PIXELS.
      var boxcolor=""; //BACKGROUND BOX COLOR.
      var speed=50; //SPEED OF SCROLL IN MILLISECONDS (1 SECOND=1000 MILLISECONDS)..
      var pixelstep=4; //PIXELS "STEPS" PER REPITITION.
      var goright=false; //LEFT TO RIGHT=TRUE , RIGHT TO LEFT=FALSE

      //** DO NOT EDIT BEYOND THIS POINT **
      var outer,inner,ref,elementwidth;
      var w3c=(document.getElementById)?true:false;
      var ns4=(document.layers)?true:false;
      var ie4=(document.all && !w3c)?true:false;
      var ie5=(document.all && w3c)?true:false;
      var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
      var txt='';
      if(ns4){
      txt+='<table cellpadding=0 cellspacing=0 border=0 height='+boxheight+' width='+boxwidth+'><tr><td>';
      txt+='<ilayer name="ref" bgcolor="'+boxcolor+'" width="'+boxwidth+'" height="'+boxheight+'"></ilayer>';
      txt+='</td></tr></table>';
      txt+='<layer name="outer" bgcolor="'+boxcolor+'" visibility="hidden" width="'+boxwidth+'" height="'+boxheight+'">';
      txt+='<layer name="inner" visibility="hidden" left="2" top="2">';
      txt+=content;
      txt+='</layer></layer>';
      }else{
      txt+='<div id="ref" style="position:relative; width:'+boxwidth+'; height:'+boxheight+'; visibility:visible; background-color:'+boxcolor+';"></div>';
      txt+='<div id="outer" style="position:absolute; width:'+boxwidth+'; height:'+boxheight+'; visibility:hidden; background-color:'+boxcolor+'; overflow:hidden;">';
      txt+='<div id="inner" style="position:absolute; visibility:hidden; left:1px; top:1px; overflow:hidden; cursor:default;">';
      txt+=content;
      txt+='</div></div>';
      }
      document.write(txt);

      function getPageLeft(el){
      var x;
      if(ns4)return el.pageX;
      if(ie4||w3c){
      x = 0;
      while(el.offsetParent!=null){
      x+=el.offsetLeft;
      el=el.offsetParent;
      }
      x+=el.offsetLeft;
      return x;
      }}

      function getPageTop(el){
      var y;
      if(ns4)return el.pageY;
      if(ie4||w3c){
      y=0;
      while(el.offsetParent!=null){
      y+=el.offsetTop;
      el=el.offsetParent;
      }
      y+=el.offsetTop;
      return y;
      }}

      function getElWidth(el){
      if(ns4)return (el.document.width)? el.document.width : el.clip.right-el.clip.left;
      else if(ie4||ie5)return (el.style.width)? el.style.width:el.clientWidth;
      else if(w3c)return (el.style.width)?parseInt(el.style.width)arseInt(el.offsetWidth);
      else return -1;
      }

      window.onresize=function(){
      if(ns4)setTimeout('history.go(0)', 400);
      else{
      outer.style.left=getPageLeft(ref)+'px';
      outer.style.top=getPageTop(ref)+'px';
      }}

      function scrollbox(){
      if(ns4){
      inner.left+=(goright)? pixelstep: -pixelstep;
      inner.clip.right=(boxwidth-inner.left-2>boxwidth)? boxwidth-2 : boxwidth-inner.left-2;
      inner.clip.left=-inner.left+2;
      if(goright){
      if(inner.left>boxwidth)inner.left=-elementwidth;
      }else{
      if(inner.left<-elementwidth)inner.left=boxwidth+2;
      }}else{
      inner.style.left=parseInt(inner.style.left)+((goright)? pixelstep: -pixelstep)+'px';
      if(goright){
      if(parseInt(inner.style.left)>boxwidth)inner.style.left=-elementwidth+'px';
      }else{
      if(parseInt(inner.style.left)<-elementwidth)inner.style.left=boxwidth+2+'px';
      }}}

      window.onload=function(){
      ref=(ns4)?document.layers['ref']ie4)?document.all['ref']:document.getElementById('ref');
      outer=(ns4)?document.layers['outer']ie4)?document.all['outer']:document.getElementById('outer');
      inner=(ns4)?outer.document.layers['inner']ie4)?document.all['inner']:document.getElementById('inner');
      elementwidth=getElWidth(inner);
      if(ns4){
      outer.clip.width=boxwidth;
      outer.clip.height=boxheight;
      outer.moveTo(getPageLeft(ref),getPageTop(ref));
      inner.left=(goright)? -elementwidth : boxwidth-2;
      inner.clip.width=0
      inner.clip.height=boxheight-4;
      outer.visibility="show";
      inner.visibility="show";
      }else{
      outer.style.left=getPageLeft(ref)+'px';
      outer.style.top=getPageTop(ref)+'px';
      inner.style.width=elementwidth+'px';
      inner.style.left=((goright)? -elementwidth : boxwidth-2)+'px';
      inner.style.visibility="visible";
      }
      setInterval('scrollbox()',speed);
      }
      </script>
      <!-- HORIZONTAL MARQUEE SCROLLER ... END -->

      </td>
      </tr>
      </table>
      </body>
      </html>


      IFRAME SRC
      <html>
      <head>
      </head>
      <body bgcolor="#FBFCC2">
      <p>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling<br><br>
      just extra text for scrolling
      </p>

      <!--DO NOT REMOVE BELOW SCRIPT. IT SHOULD ALWAYS APPEAR AT THE VERY END OF YOUR CONTENT-->

      <script language="JavaScript1.2">

      //Scrollable content III- By http://www.dynamicdrive.com
      // already changed "speed" to "iframespeed" in this page...in case it was conflicting with the other "speed" in the 2nd script.
      var iframespeed, currentpos=curpos1=0,alt=1,curpos2=-1

      function initialize(){
      if (window.parent.scrollspeed!=0){
      iframespeed=window.parent.scrollspeed
      scrollwindow()
      }
      }

      function scrollwindow(){
      temp=(document.all)? document.body.scrollTop : window.pageYOffset
      alt=(alt==0)? 1 : 0
      if (alt==0)
      curpos1=temp
      else
      curpos2=temp

      window.scrollBy(0,iframespeed)
      }

      setInterval("initialize()",10)

      </script>
      </body>
      </html>
      Gordo
      New to the CF scene
      Last edited by Gordo; Jul 8, 2002, 09:59 PM.
      Gordo
      "In the End, we will remember not the words of our enemies, but the silence of our friends."
      - Martin Luther King Jr. (1929-1968)

      Comment


      • #4
        is this one page? you have 2 html/head/body sets.

        can you give a link to your actual site? might make it easier to see the problem.

        Comment


        • #5
          Yes...two pages. The second one is the SRC for the iframe. I only pasted the code because GeoCities was not letting me upload the pages when I posted last.

          This latest code is now 'live' at http://www.geocities.com/gordonmerri...-08_6-30pm.htm .

          Any "unterminated string constant" error that you may be presented with is a standard GeoCities pop-up ad conflict. It may try to load inside the iframe. Just close the pop-up, and you'll be able to test the page.

          Thanks for taking a look!
          Gordo
          "In the End, we will remember not the words of our enemies, but the silence of our friends."
          - Martin Luther King Jr. (1929-1968)

          Comment


          • #6
            Even though 50% of this is a DD script, perhaps this belongs under "JavaScript programming"...perhaps not. Mods? Anyone? I could really, really, really use a hand on this one.
            Gordo
            "In the End, we will remember not the words of our enemies, but the silence of our friends."
            - Martin Luther King Jr. (1929-1968)

            Comment

            Working...
            X