我正在尝试让ticker从页面的零像素从页面的左侧开始从右到左滚动。
下面是代码。
<!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>
编辑
下面附上截图。
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>