Home/ Questions/Q 8270511
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-08T06:35:16+00:00

I am trying to make ticker to scroll right to left from zero pixel

  • 0

I am trying to make ticker to scroll right to left from zero pixel of the page starts at left of the page.

Below is the code.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style type="text/css">
#marqueeborder {
    color: #cccccc;
    background-color:  #000000;
    font-family:Arial, Helvetica, sans-serif;
    position:relative;
    height:20px;
    overflow:hidden;
    font-size:.8em;
}
#marqueecontent {
    position:absolute;
    left:0px;
    line-height:20px;
    white-space:nowrap;
}
.stockbox {
    margin:0 10px;
}
.stockbox a {
    color: #cccccc;
    text-decoration : none;
    font-weight: 400;
}
  </style>
<script type="text/javascript">

    // Original script by Walter Heitman Jr, first published on http://techblog.shanock.com

    // Set an initial scroll speed. This equates to the number of pixels shifted per tick
    var scrollspeed=3;
    var pxptick=scrollspeed;
var marqueediv='';
var contentwidth="";
var marqueewidth = "";
    function startmarquee(){
        //alert("hi");
        // Make a shortcut referencing our div with the content we want to scroll
        marqueediv=document.getElementById("marqueecontent");
        //alert("marqueediv"+marqueediv);
    //  alert("hi"+marqueediv.innerHTML);

        // Get the total width of our available scroll area
         marqueewidth=document.getElementById("marqueeborder").offsetWidth;
        //alert("marqueewidth"+marqueewidth);
        // Get the width of the content we want to scroll
         contentwidth=marqueediv.offsetWidth;
    //  alert("contentwidth"+contentwidth);
    /// // Start the ticker at 50 milliseconds per tick, adjust this to suit your preferences
        // Be warned, setting this lower has heavy impact on client-side CPU usage. Be gentle.
        var lefttime=setInterval("scrollmarquee()",50);
        //alert("lefttime"+lefttime);
    }

    function scrollmarquee(){
        // Check position of the div, then shift it left by the set amount of pixels.

        if (parseInt(marqueediv.style.left)>(contentwidth*(-1)))
            marqueediv.style.left=parseInt(marqueediv.style.left)-pxptick+"px";
        //alert("hikkk"+marqueediv.innerHTML);}
        // If it's at the end, move it back to the right.
        else{
        //  alert("marqueewidth"+marqueewidth);
            marqueediv.style.left=parseInt(marqueewidth)+"px";
        }
    }

    //window.onload=startmarquee;

</script>
 </head>

 <body>
  <div id="marqueeborder" onmouseover="pxptick=0" onmouseout="pxptick=scrollspeed">

<div id="marqueecontent">


<?php

    // Original script by Walter Heitman Jr, first published on http://techblog.shanock.com

    // List your stocks here, separated by commas, no spaces, in the order you want them displayed:


</div>
</div>

 </body>
</html>

Edit

Attached screenshot below.

How it should look like

Edit2:
oh i missed its index.php

<html>
<body>

<?php include 'stockticker.php'; ?>

<h1>Welcome to index page!</h1>

</body>
<script type="text/javascript">
function onloadfun(){
startmarquee();

}
window.onload=onloadfun;
</script>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Ok, here you go..
    there was problem in your scrollmarquee function. Replace it’s content with these

    if (parseInt(marqueediv.offsetLeft)>=(contentwidth*(-1))){
    console.log(parseInt(marqueediv.offsetLeft)-pxptick+"px");
    marqueediv.style.left = parseInt(marqueediv.offsetLeft)-pxptick+"px";
}else{
    marqueediv.style.left=parseInt(marqueewidth)+"px";
}

    The condition had to be reversed. Now it’s all great
    🙂

    • 0