`
andrew.yulong
  • 浏览: 172652 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

上下滚动 标题停留(字母,图片)

    博客分类:
  • js
ASP 
阅读更多
<script language="JavaScript1.2">
//这里配置滚动字幕的属性
var scrollerwidth=350
var scrollerheight=20
var scrollerbgcolor='#ffdfd0'
var scrollerbackground='scrollerback.gif'

//修改下面的文字及文字所指向的链接
var messages=new Array()
messages[
0]="<font face='Arial'><a href='../../index.asp'>回到首页仔细看看,看看微风吹过竹叶摇动的效果</a></font>"
messages[
1]="<font face='Arial'><a href='../wytx.htm'>请到本站的网页特效区看看,这里有大量的网页特效供你选择</a></font>"
messages[
2]="<font face='Arial'><a href='../../bzlt/index.asp'>如果你在游览本站时有什么问题,请到本站的论坛发表看法</a></font>"


///////不要修改下面的内容///////////////////////

if (messages.length>1)
i
=2
else
i
=0

function move1(whichlayer)
{
tlayer
=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5)
{
tlayer.top
=0
setTimeout(
"move1(tlayer)",3000)
setTimeout(
"move2(document.main.document.second)",3000)
return    
}
if (tlayer.top>=tlayer.document.height*-1)
{
tlayer.top
-=5
setTimeout(
"move1(tlayer)",100)
}
else
{
tlayer.top
=scrollerheight
tlayer.document.write(messages[i])
tlayer.document.close()
if (i==messages.length-1)
i
=0
else
i
++
}
}

function move2(whichlayer)
{
tlayer2
=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5)
{
tlayer2.top
=0
setTimeout(
"move2(tlayer2)",3000)
setTimeout(
"move1(document.main.document.first)",3000)
return
}
if (tlayer2.top>=tlayer2.document.height*-1)
{
tlayer2.top
-=5
setTimeout(
"move2(tlayer2)",100)
}
else{
tlayer2.top
=scrollerheight
tlayer2.document.write(messages[i])
tlayer2.document.close()
if (i==messages.length-1)
i
=0
else
i
++
}
}

function move3(whichdiv)
{
tdiv
=eval(whichdiv)
if (tdiv.style.pixelTop>0&&tdiv.style.pixelTop<=5)
{
tdiv.style.pixelTop
=0
setTimeout(
"move3(tdiv)",3000)
setTimeout(
"move4(second2)",3000)
return
}
if (tdiv.style.pixelTop>=tdiv.offsetHeight*-1)
{
tdiv.style.pixelTop
-=5
setTimeout(
"move3(tdiv)",100)
}
else{
tdiv.style.pixelTop
=scrollerheight
tdiv.innerHTML
=messages[i]
if (i==messages.length-1)
i
=0
else
i
++
}
}

function move4(whichdiv)
{
tdiv2
=eval(whichdiv)
if (tdiv2.style.pixelTop>0&&tdiv2.style.pixelTop<=5)
{
tdiv2.style.pixelTop
=0
setTimeout(
"move4(tdiv2)",3000)
setTimeout(
"move3(first2)",3000)
return
}
if (tdiv2.style.pixelTop>=tdiv2.offsetHeight*-1)
{
tdiv2.style.pixelTop
-=5
setTimeout(
"move4(second2)",100)
}
else{
tdiv2.style.pixelTop
=scrollerheight
tdiv2.innerHTML
=messages[i]
if (i==messages.length-1)
i
=0
else
i
++
}
}

function startscroll()
{
if (document.all)
{
move3(first2)
second2.style.top
=scrollerheight
second2.style.visibility
='visible'
}
else if (document.layers)
{
document.main.visibility
='show'
move1(document.main.document.first)
document.main.document.second.top
=scrollerheight+5
document.main.document.second.visibility
='show'
}
}
window.onload
=startscroll
</script>

<ilayer id="main" width=&{scrollerwidth}; height=&{scrollerheight}; bgColor=&{scrollerbgcolor}; background=&{scrollerbackground}; visibility=hide>
<layer id="first" left=0 top=1 width=&{scrollerwidth};>
<script language="JavaScript1.2">
if (document.layers)
document.write(messages[
0])
</script>
</layer>
<layer id="second" left=0 top=0 width=&{scrollerwidth}; visibility=hide>
<script language="JavaScript1.2">
if (document.layers)
document.write(messages[
1])
</script>
</layer>
</ilayer>
<script language="JavaScript1.2">
if (document.all)
{
document.writeln(
'<span id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hiden;background-color:'+scrollerbgcolor+' ;background-image:url('+scrollerbackground+')">')
document.writeln(
'<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0;top:0">')
document.writeln(
'<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0;top:1;">')
document.write(messages[
0])
document.writeln(
'</div>')
document.writeln(
'<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0;top:0;visibility:hidden">')
document.write(messages[
1])
document.writeln(
'</div>')
document.writeln(
'</div>')
document.writeln(
'</span>')
}
</script>

 

分享到:
评论

相关推荐

    js图片滚动插件支持单排图片上下滚动、图片无缝滚动

    首先,单排图片上下滚动是指在网页的一行(或一列)内展示图片,并允许用户通过点击按钮或自动播放来上下滚动这些图片。这种方式使得有限的网页空间可以展示更多的图片信息,同时保持页面布局的整洁。在JavaScript中...

    上下滚动tab标题跟随联动效果,点击tab滚动切换模块

    "上下滚动tab标题跟随联动效果,点击tab滚动切换模块"这一技术实现,是UI设计中的一个常见功能,常用于增强用户的交互体验,尤其在电商、资讯类应用中广泛使用。这种效果模仿了大众点评店铺详情页的设计,旨在提供...

    图片上下滚动带控制按钮,兼容所有浏览器

    在网页设计中,实现“图片上下滚动带控制按钮”是一种常见的动态效果,它能为用户提供更直观、便捷的浏览体验。这种效果尤其适用于展示多张图片的场景,如产品展示、摄影集或画廊等。下面我们将深入探讨如何实现这个...

    标题上下滚动

    标题上下滚动是一种常见的UI设计效果,它在网页、APP或者软件界面中被广泛使用,用于显示重要的通知、提示信息或滚动新闻。这种效果使得信息能够动态地吸引用户的注意力,而无需占据屏幕的固定空间。在编程实现时,...

    易语言标签上下滚动

    在易语言中,"标签上下滚动"是一个常见的用户界面(UI)效果,常用于显示大量文本信息时,避免因信息过多而无法完全展示。 "标签"在软件开发中通常指的是一个可以显示固定或动态文本的控件,如Windows操作系统中的...

    图片上下滚动带按钮

    标题“图片上下滚动带按钮”描述的是一个网页或应用程序中的交互设计功能,用户可以通过点击页面上下的两个按钮来实现图片的上下滚动。这种设计常见于图片展示、产品介绍或者滑动浏览场景,使得用户可以方便地查看...

    js 上下(左右)图片滚动

    "js 上下(左右)图片滚动"就是一种常见的动态展示技术,它利用JavaScript实现图片的自动滚动,为网站增添活力。在这个主题中,我们将深入探讨如何利用JavaScript实现图片的上下滚动和左右滚动效果。 首先,我们要...

    ViewSwitcher文字图片上下滚动

    在这个特定的场景中,“ViewSwitcher文字图片上下滚动”的实现涉及到如何动态地展示和切换包含文字和图片的视图,并且使它们能够按照上下顺序滚动。 首先,我们需要理解ViewSwitcher的基本用法。ViewSwitcher内部...

    delphi滚动字幕(标题滚动,上下及左右字幕滚动)

    本项目涉及了三种类型的滚动字幕实现,包括标题滚动、Label滚动以及字幕从下往上滚动。下面将详细讲解这些滚动效果的实现原理和步骤。 1. **标题滚动**: 标题滚动通常是应用程序窗口顶部的标题栏中的文字进行动态...

    超炫的jquery图片上下滚动效果

    本文将详细讲解如何利用jQuery创建“超炫的图片上下滚动效果”。 一、jQuery简介 jQuery是由John Resig在2006年创建的一个开源库,它的核心理念是“Write Less, Do More”。jQuery简化了HTML文档遍历、事件处理、...

    jquery 图片滚动 xslider 插件 按钮控制自动图片左右滚动、上下滚动

    jquery 图片滚动 xslider 插件制作图片自动左右滚动与上下滚动,这个图片滚动xslider插件不复制整个容器里面的内容,直接用按钮控制滚动,直到滚动图片内容到最后一个,适用在图片展示滚动和新

    UGUI上下循环滚动数字(图片)

    参考链接 : https://blog.csdn.net/dengshunhao/article/details/82657585(包含效果图) UGUI实现闹钟选择,数字上下循环滚动(当然也可以换成其他UI,比如图片)

    文章标题上下轮番滚动.zip

    在网页设计中,文章标题的上下轮番滚动是一种常见的动态效果,它能够吸引用户的注意力,尤其是在新闻网站或者公告栏上,这种设计可以让重要的信息在有限的空间内得到有效的展示。接下来,我们将深入探讨如何实现这样...

    jQuery仿新浪微博图片文字列表间歇上下滚动淡进淡出滚动-20130622

    【jQuery仿新浪微博图片文字列表间歇上下滚动淡进淡出滚动-20130622】这个项目是基于JavaScript库jQuery实现的一种效果,它模拟了新浪微博中图片和文字列表的滚动展示方式,通常用于新闻资讯或者社交媒体的动态展示...

    WinForm 文本上下滚动控件

    "WinForm文本上下滚动控件"是专为实现这种功能而设计的自定义控件,它允许文本在控件区域内上下滚动,提供了一种动态显示大量文本的方式,尤其适用于日志查看、消息提示等场景。 该控件的特点在于其高度可定制性。...

    TabLayout上下滑动标题停留顶部

    本文将深入探讨如何实现一个`TabLayout`,使得它在上下滑动时能够停留在页面顶部,这种效果通常与`CoordinatorLayout`和`ViewPager`结合使用。我们将详细解析`CoordinatorLayout`、`TabLayout`以及`ViewPager`的工作...

    很炫的图片无缝上下滚动效果.rar

    【标题】"很炫的图片无缝上下滚动效果.rar"是一个包含JavaScript实现的动态图片滚动效果的资源包。这种效果常用于网站的图片展示,能够给用户带来流畅且引人注目的视觉体验,使得图片相册更加生动活泼。 【描述】...

    Android 实现TextView上下滚动效果

    在Android开发中,实现TextView的上下滚动效果可以让信息在有限的空间内持续展示,提升用户体验。以下将详细讲解如何实现这一功能。 首先,我们要明白TextView是Android SDK中的一个基础组件,用于显示单行或多行...

    首页通知上下滚动效果

    在Android应用开发中,"首页通知上下滚动效果"是一种常见的用户界面(UI)设计,用于展示重要的、实时更新的通知信息。这种效果使得用户无需离开主页面就能获取到新消息,提高了用户体验。本篇将深入探讨如何实现...

    图片的上下滚动用js和flash技术

    标题中的“图片的上下滚动”是指在网页中实现图片轮播的一种效果,用户可以通过点击按钮或者设置自动滚动,使得图片能够上下切换展示。这种效果在网站设计中常见于产品展示、相册浏览等场景,可以增加用户体验,提高...

Global site tag (gtag.js) - Google Analytics