杰晶网络

文字不间断滚动(上下左右)实例代码
网络编程 2024/11/16 佚名
3 2

向上
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>连续向上滚动</title>
<style type="text/css">
<!--
body {
 font-size: 9pt;
 color: #000000;
}
a {
    color: #0000FF;
 text-decoration: none;
}
a:hover {
 color: #FF0000;
 text-decoration: underline;
}
-->
</style>
</head>
<body>
<div id="marquees"> <a href="#">链接一</a><br>
  <br>
  <a href="#">链接二</a><br>
  <br>
  <a href="#">链接三</a><br>
  <br>
  <a href="#">链接四</a><br>
  <br>
</div>
<script language="JavaScript">

marqueesHeight=200;
stopscroll=false;

with(marquees){
  style.width=0;
  style.height=marqueesHeight;
  style.overflowX="visible";
  style.overflowY="hidden";
  noWrap=true;
  onmouseover=new Function("stopscroll=true");
  onmouseout=new Function("stopscroll=false");
}
document.write('<div id="templayer" style="position:absolute;z-index:1;visibility:hidden"></div>');

preTop=0; currentTop=0;

function init(){
  templayer.innerHTML="";
  while(templayer.offsetHeight<marqueesHeight){
    templayer.innerHTML+=marquees.innerHTML;
  }
  marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;
  setInterval("scrollUp()",100);
}
document.body.onload=init;

function scrollUp(){
  if(stopscroll==true) return;
  preTop=marquees.scrollTop;
  marquees.scrollTop+=1;
  if(preTop==marquees.scrollTop){
    marquees.scrollTop=templayer.offsetHeight-marqueesHeight;
    marquees.scrollTop+=1;
  }
}
</script>
</body>
</html>

向下
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>连续向下滚动</title>
<style type="text/css">
<!--
body {
 font-size: 9pt;
 color: #000000;
}
a {
    color: #0000FF;
 text-decoration: none;
}
a:hover {
 color: #FF0000;
 text-decoration: underline;
}
-->
</style>
</head>
<body>
<div id="marquees"> <a href="#">链接一</a><br>
  <br>
  <a href="#">链接二</a><br>
  <br>
  <a href="#">链接三</a><br>
  <br>
  <a href="#">链接四</a><br>
  <br>
</div>
<script language="JavaScript">

marqueesHeight=200;

with(marquees){
style.width=0;
style.height=marqueesHeight;
style.overflowX="visible";
style.overflowY="hidden";
noWrap=true;
onmouseover=new Function("stopscroll=true");
onmouseout=new Function("stopscroll=false");
}
document.write('<div id="templayer" style="position:absolute;z-index:1;visibility:hidden"></div>');
preTop=0; currentTop=0;getlimit=0;stopscroll=false;

function init(){
templayer.innerHTML="";
while(templayer.offsetHeight<marqueesHeight){
templayer.innerHTML+=marquees.innerHTML;
}
marquees.innerHTML+=templayer.innerHTML;
setInterval("scrollDown()",10);
}init();

function scrollDown(){
if(stopscroll==true) return;

preTop=marquees.scrollTop;
marquees.scrollTop-=1;
if(preTop==marquees.scrollTop){
  if(!getlimit){
    marquees.scrollTop=templayer.offsetHeight*2;
    getlimit=marquees.scrollTop;
  }
marquees.scrollTop=getlimit-templayer.offsetHeight+marqueesHeight;
marquees.scrollTop-=1;
}
}
</script>
</body>
</html>

向左
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>连续向左滚动</title>
<style type="text/css">
<!--
body {
 font-size: 9pt;
 color: #000000;
}
a {
    color: #0000FF;
 text-decoration: none;
}
a:hover {
 color: #FF0000;
 text-decoration: underline;
}
-->
</style>
</head>
<body>
<div id="marquees"> <a href="#">链接一</a> <a href="#">链接二</a> <a href="#">链接三</a> <a href="#">链接四</a> </div>
<div id="templayer" style="position:absolute;left:0;top:0;visibility:hidden"></div>
<script language="JavaScript">

marqueesWidth=200;

with(marquees){
style.height=0;
style.width=marqueesWidth;
style.overflowX="hidden";
style.overflowY="visible";
noWrap=true;
onmouseover=new Function("stopscroll=true");
onmouseout=new Function("stopscroll=false");
}
preLeft=0; currentLeft=0; stopscroll=false;

function init(){
templayer.innerHTML="";
while(templayer.offsetWidth<marqueesWidth){
templayer.innerHTML+=marquees.innerHTML;
}
marquees.innerHTML+=templayer.innerHTML;
setInterval("scrollLeft()",100);
}init();

function scrollLeft(){
if(stopscroll==true) return;
preLeft=marquees.scrollLeft;
marquees.scrollLeft+=1;
if(preLeft==marquees.scrollLeft){
  marquees.scrollLeft=templayer.offsetWidth-marqueesWidth+1;
}
}


</script>
</body>
</html>

向右
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>连续向右滚动</title>
<style type="text/css">
<!--
body {
 font-size: 9pt;
 color: #000000;
}
a {
    color: #0000FF;
 text-decoration: none;
}
a:hover {
 color: #FF0000;
 text-decoration: underline;
}
-->
</style>
</head>
<body>
<div id="marquees"> <a href="#">链接一</a> <a href="#">链接二</a> <a href="#">链接三</a> <a href="#">链接四</a> </div>
<div id="templayer" style="position:absolute;left:0;top:0;visibility:hidden"></div>
<script language="JavaScript">

marqueesWidth=200;

with(marquees){
style.height=0;
style.width=marqueesWidth;
style.overflowX="hidden";
style.overflowY="visible";
noWrap=true;
onmouseover=new Function("stopscroll=true");
onmouseout=new Function("stopscroll=false");
}
preTop=0; currentTop=0; getlimit=0; stopscroll=false;

function init(){
templayer.innerHTML="";
while(templayer.offsetWidth<marqueesWidth){
templayer.innerHTML+=marquees.innerHTML;
}
marquees.innerHTML+=templayer.innerHTML;
setInterval("scrollRight()",10);
}init();

function scrollRight(){
if(stopscroll==true) return;

preLeft=marquees.scrollLeft;
marquees.scrollLeft-=1;
if(preLeft==marquees.scrollLeft){
  if(!getlimit){
    marquees.scrollLeft=templayer.offsetWidth*2;
    getlimit=marquees.scrollLeft;
  }
  marquees.scrollLeft=getlimit-templayer.offsetWidth+marqueesWidth;
  marquees.scrollLeft-=1;
}
}
</script>
</body>
</html>

标签：
文字,滚动
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
评论“文字不间断滚动(上下左右)实例代码”
暂无“文字不间断滚动(上下左右)实例代码”评论...
www.imxmx.com 杰晶网络
8,675无损音乐
1,324高清电影
213破解软件
120,141站长资源
一句话新闻
苹果官宣WWDC 2024！预计会有大批AI功能 - 2024/11/16

3月27日消息，苹果宣布2024年全球开发者大会（WWDC）将于6月10日至6月14日举行，巧合的是，这次大会与端午假期重合。

苹果官方表示：

在线参加 Apple 每年规模最大的开发者盛会。亲眼见证 Apple 最新平台、技术和工具的发布。了解如何创建和改进你的 App 和游戏。与 Apple 设计师和工程师互动交流，与全球开发者社区建立联系。以上活动均免费在线举行。

探索各种新的工具、框架和功能，助力你打造出理想的 App 和游戏。通过视频讲座学习新技能，与 Apple 专家进行一对一会面，以推进你的项目，完善你的构思。

Swift Student Challenge 旨在支持和鼓舞下一代开发者、创作者和企业家。太平洋时间 3 月 28 日，我们将公布今年的获奖者名单。获奖者将有资格参加在 Apple Park 举办的特别活动。我们还会选出 50 名杰出获胜者，他们将受邀前往库比提诺，获得为期三天的非凡体验，包括参加 Apple Park 的特别活动。

RTX 5090要首发 性能要翻倍！三星展示GDDR7显存

三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。

首次推出的GDDR7内存模块密度为16GB，每个模块容量为2GB。其速度预设为32 Gbps（PAM3），但也可以降至28 Gbps，以提高产量和初始阶段的整体性能和成本效益。

据三星表示，GDDR7内存的能效将提高20%，同时工作电压仅为1.1V，低于标准的1.2V。通过采用更新的封装材料和优化的电路设计，使得在高速运行时的发热量降低，GDDR7的热阻比GDDR6降低了70%。

更新动态

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网