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 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Nov 2003
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Help with manipulating code.

    In the following code, I would like the images to keep looping instead of stopping at the edge of the page. Please help!
    OR if you know a better code that we could use, that have images that scroll horizontally that can be controlled by rollover link (for both IE and Netscape).

    Thanks for any help.

    Code:
    <!-- ONE STEP TO INSTALL SCROLLING IMAGE:
    
      1.  Copy the coding into the BODY of your HTML document  -->
    
    <!-- STEP ONE: Paste this code into the BODY of your HTML document  -->
    
    <BODY>
    
    <SCRIPT LANGUAGE="JavaScript">
    
    <!-- This script and many more are available free online at -->
    <!-- The JavaScript Source!! http://javascript.internet.com -->
    <!-- Original:  Premshree Pillai (premshree@hotmail.com ) -->
    <!-- Web Site:  http://www.qiksearch.com/ -->
    <!-- Begin
    window.onerror = null;
     var bName = navigator.appName;
     var bVer = parseInt(navigator.appVersion);
     var NS4 = (bName == "Netscape" && bVer >= 4);
     var IE4 = (bName == "Microsoft Internet Explorer" && bVer >= 4);
     var NS3 = (bName == "Netscape" && bVer < 4);
     var IE3 = (bName == "Microsoft Internet Explorer" && bVer < 4);
    
    //------------------C U S T O M I S E------------------------
    
     var img_path="http://javascript.internet.com/img/headerlogo.gif";
     var time_length =50; //Scroll delay in milliseconds
     var begin_pos = 265; //Start position of scroll hint
    
    //-----------------------------------------------------------
    
    var i=begin_pos;
    var j=i; 
    var scroll_length = 350; //The scroll length
    var original_time=time_length;
    
    if (NS4 || IE4) {
     if (navigator.appName == "Netscape") {
     layerStyleRef="layer.";
     layerRef="document.layers";
     styleSwitch="";
     }else{
     layerStyleRef="layer.style.";
     layerRef="document.all";
     styleSwitch=".style";
     }
    }
    
    //SCROLL RIGHT
    function scroll_right(layerName)
    {
     if (NS4 || IE4)
     { 
       if(i<(begin_pos+scroll_length))
       {
        eval(layerRef+'["'+layerName+'"]'+
        styleSwitch+'.visibility="visible"');
        eval(layerRef+'["'+layerName+'"]'+ styleSwitch+'.left="'+(i)+'"');
        i++;
        j++;
       }
      if(i==j)
      {
       setTimeout("scroll_right('"+layerName+"')",time_length);
      }
     }
    }
    
    //SCROLL LEFT
    function scroll_left(layerName)
    {
     if (NS4 || IE4)
     {
       if(i>(begin_pos-scroll_length))
       {
        eval(layerRef+'["'+layerName+'"]'+
        styleSwitch+'.visibility="visible"');
        eval(layerRef+'["'+layerName+'"]'+ styleSwitch+'.left="'+(i)+'"');
        i--;
        j--;
       }
      if(i==j)
      {
       setTimeout("scroll_left('"+layerName+"')",time_length);
      }
     }
    }
    
    function scroll_out()
    {
     time_length=10000000000000;
    }
    
    function reset()
    { 
     time_length=original_time;
    }
    
    document.write('<div id="prem_hint" style="position:relative; left:' + begin_pos + '" class="prem_hint"><img src="http://javascript.internet.com/img/headerlogo.gif"><br><font size="-1"><b>You can even scroll a Text<br><font color="#003399">You can scroll multiple lines.</font></b></font></div><center><a href="#" class="link" onmouseover="javascript:reset(); scroll_left('prem_hint');" onmouseout="javascript:scroll_out();"><b><< Scroll Left</b></a> <b>|</b> <a href="#" class="link" onmouseover="javascript:reset(); scroll_right('prem_hint');" onmouseout="javascript:scroll_out();"><b>Scroll Right >></b></a></center>');
    //  End -->
    </script>
    
    <p><center>
    <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
    by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
    </center><p>
    
    <!-- Script Size:  3.21 KB -->
    Last edited by dave974; 08-17-2004 at 06:31 AM.

  • #2
    Senior Coder
    Join Date
    Jul 2004
    Location
    New Zealand
    Posts
    1,315
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Please edit your post ansd put all code inside code tags.

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by hemebond
    Please edit your post ansd put all code inside code tags.
    Hemebond,

    If you aren't going to reply and provide help, don't go making demands of the posters.


    Dave,

    That particular script was designed for IE 4 and Netscape 4 both of which are obsolete and nearly extinct. While the IE code will still work in the current IE browsers, the Netscape code is definitely not good for the current Netscape browser.

    If I understand you correctly you want the image to show up on the opposite side of the browser after it has been scrolled off one side?

    Just to be sure about what kind of script you need though, what purpose will this script serve on your web page? How do you want the users to interact with this moving image?
    Check out the Forum Search. It's the short path to getting great results from this forum.

  • #4
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm sure I fixed this to be cross-browser...
    Not sure if I grabbed the right copy tho....

    Code:
    <script type="text/javascript">
     <!--//
      var left = -100;
      function moveIt(){
        if (left <= window.screen.availWidth){
            document.getElementById('theFrog').style.left = left + 'px';
            move = setTimeout('moveIt(left+=5)',100); 
        }
        if (left >= window.screen.availWidth){
            clearTimeout(move);
            left = -100;
            moveIt();
        }
      }
     //-->
    </script>
    </head>
    
    <body onload="moveIt()">
    <div id="theDiv"  style="position:relative; top:0; left:0; overflow:hidden">
    <img id="theFrog" style="position:absolute; top:0; left:-100px; z-index:2"
    src="http://nunzioweb.com/misc/frogwalk.gif">
    </div>
    .....Willy
    Last edited by Willy Duitt; 08-19-2004 at 04:21 PM.


  •  

    Posting Permissions

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