2012-07-22 48 views
2

Iam尝试使页面从零页像素开始在页面左侧从右向左滚动。如何让报价器从页面的零px从右到左滚动

下面是代码。

<!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> 

编辑下面

附截图。

How it should look like

请任何人都可以在这个

EDIT2帮助: 哦,我错过了它的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> 
+0

ok ..so问题在哪里? – Shades88 2012-07-22 19:22:30

+0

@ Shades88我添加了屏幕截图 – developer 2012-07-22 19:23:59

+0

@downvoters请对downvolting – developer 2012-07-22 19:24:21

回答

2

好了,在这里你去.. 有你scrollmarquee是问题功能。用这些替换它的内容

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"; 
} 

必须颠倒这个条件。现在,这一切都很好 :)

相关问题