怎的实现以下的文字滚动效果
日期：2014-05-16 浏览次数：20490 次
怎样实现以下的文字滚动效果？
下面是代码，可以存成html文件在浏览器中查看。要求是向上滚动的文字不要到上方框才消
失，离方框有一段距离（距离可调）就消失。试过很多方法，如padding、margin、z-inde
x等，都没有成功。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html lang="en">
<head>
<meta name="generator" content="HTML Tidy for Windows (vers 14 February 2006),
see www.w3.org">
<title></title>
<style type="text/css">
#marqueecontainer{
? ?? ???position: relative;
? ?? ???width: 210px; /*marquee width */
? ?? ???height: 300px; /*marquee height */
? ?? ???overflow: hidden;
? ? border: 3px solid orange;
? ?? ???/*padding-left: 4px;*/
? ?? ???/*padding-bottom: 30px;*/
? ?? ???/*background-image: url(notice_bg.gif);
? ?? ???background-repeat: repeat-x;*/
? ?? ???/*z-index:-1;*/
}
#vmarquee{
? ? /*padding-top:20px;*/
? ?? ???/*left: 8px;*/
? ?? ???/*top: 58px;*/
}
</style>
<script type="text/javascript">
var delayb4scroll=1 ;//Specify initial delay before marquee starts to scroll on
page (2000=2 seconds)
var marqueespeed=2; //Specify marquee scroll speed (larger is faster 1-10)
var pauseit=1 ;//Pause marquee onMousever (0=no. 1=yes)?
////NO NEED TO EDIT BELOW THIS LINE////////////
var copyspeed=marqueespeed;
var pausespeed=(pauseit==0)? copyspeed: 0;
var actualheight=''
function initializemarquee(){
cross_marquee=document.getElementById("vmarquee");
cross_marquee.style.top=0;
marqueeheight=document.getElementById("marqueecontainer").offsetHeight
actualheight=cross_marquee.offsetHeight;
var div=cross_marquee.cloneNode(true);
div.style.left='0px';
div.style.top=actualheight+'px';
// alert(div.style.top);
cross_marquee.appendChild(div);
if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera
or Netscape 7x, add scrollbars to scroll and exit
??cross_marquee.style.height=marqueeheight+"px"
??cross_marquee.style.overflow="scroll"
??return
}
setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll)
}
function scrollmarquee(){
if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
//alert(parseInt(cross_marquee.style.top));
cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px"
else
cross_marquee.style.top="0px"
}
if (window.
下面是代码，可以存成html文件在浏览器中查看。要求是向上滚动的文字不要到上方框才消
失，离方框有一段距离（距离可调）就消失。试过很多方法，如padding、margin、z-inde
x等，都没有成功。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html lang="en">
<head>
<meta name="generator" content="HTML Tidy for Windows (vers 14 February 2006),
see www.w3.org">
<title></title>
<style type="text/css">
#marqueecontainer{
? ?? ???position: relative;
? ?? ???width: 210px; /*marquee width */
? ?? ???height: 300px; /*marquee height */
? ?? ???overflow: hidden;
? ? border: 3px solid orange;
? ?? ???/*padding-left: 4px;*/
? ?? ???/*padding-bottom: 30px;*/
? ?? ???/*background-image: url(notice_bg.gif);
? ?? ???background-repeat: repeat-x;*/
? ?? ???/*z-index:-1;*/
}
#vmarquee{
? ? /*padding-top:20px;*/
? ?? ???/*left: 8px;*/
? ?? ???/*top: 58px;*/
}
</style>
<script type="text/javascript">
var delayb4scroll=1 ;//Specify initial delay before marquee starts to scroll on
page (2000=2 seconds)
var marqueespeed=2; //Specify marquee scroll speed (larger is faster 1-10)
var pauseit=1 ;//Pause marquee onMousever (0=no. 1=yes)?
////NO NEED TO EDIT BELOW THIS LINE////////////
var copyspeed=marqueespeed;
var pausespeed=(pauseit==0)? copyspeed: 0;
var actualheight=''
function initializemarquee(){
cross_marquee=document.getElementById("vmarquee");
cross_marquee.style.top=0;
marqueeheight=document.getElementById("marqueecontainer").offsetHeight
actualheight=cross_marquee.offsetHeight;
var div=cross_marquee.cloneNode(true);
div.style.left='0px';
div.style.top=actualheight+'px';
// alert(div.style.top);
cross_marquee.appendChild(div);
if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera
or Netscape 7x, add scrollbars to scroll and exit
??cross_marquee.style.height=marqueeheight+"px"
??cross_marquee.style.overflow="scroll"
??return
}
setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll)
}
function scrollmarquee(){
if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
//alert(parseInt(cross_marquee.style.top));
cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px"
else
cross_marquee.style.top="0px"
}
if (window.
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
