会移动的文字(Marquee)

Marquee标记用于在可用浏览区域中滚动文本。这个标记只适用于IE3以后的版的浏览器。 
    格式: 
    <MARQUEE ALIGN="…" 
    BEHAVIOR="…" 
    BGCOLOR="…" 
    DIRECTION="…" 
    HEIGHT="…" 
    WIDTH="…" 
    HSPACE="…" 
    VSPACE="…" 
    LOOP="…" 
    SCROLLAMOUNT="…" 
    SCROLLDELAY="…" 
        ONMOUSEOUT=this.start() 
        ONMOUSEOVER=this.stop()
    >… 
    </MARQUEE> 
   
    属性: 
    ALIGN:用于按设定的值对齐滚动的文本。ALIGN可以设定的值有:LEFT,CENTER,RIGHT,TOP,BOTTOM。此属性不是必须使用的。 
    例: 
    <MARQUEE ALIGN="TOP">这段滚动文字设定为上对齐</MARQUEE> 
   
   
    BEHAVIOR:可以在页面上一旦出现文本时让浏览器按照设定的方法来处理文本。如果设定的方法是SLIDE,那么文本就移动到文档上,并停留在页边距上。如果设定为ALTERNATE,则文本从一边移动到另一边。如果设定为SCROLL,文本将在页面上反复滚动。本属性不是必须使用的。可以设定的值有:SILIDE,ALTERNATE,SCROLL。 
    例: 
    <MARQUEE BEHAVIOR="ALTERNATE">文字从一边移动到另一边</MARQUEE> 
   
   
    BGCOLOR:用于设定字幕的背景颜色。背景颜色可用RGB、16进制值的格式或颜色名称来设定。 
    例: 
    <MARQUEE BGCOLOR="RED">用颜色名称设定滚动文字背景颜色为红色</MARQUEE> 
    <MARQUEE BGCOLOR="#FF0000">用16进制值设定滚动文字背景颜色为红色</MARQUEE> 
    <MARQUEE BGCOLOR=RGB(100%,0%,0%)>用RGB设定滚动文字背景颜色为红色</MARQUEE> 
      
    DIRECTION:用于设定文本滚动的方向,可以设定的值有:LEFT,RIGHT。此属性不是必须使用的。 
    例: 
    <MARQUEE DIRECTION="LEFT">文字向左边滚动</MARQUEE> 
    <MARQUEE DIRECTION="RIGHT">文字向右边滚动</MARQUEE> 
   
           HEIGHT:用于设定滚动字幕的高度,高度可用像素或可视页面的百分比来表示。此属性不是必须使用的。 
    例: 
    <MARQUEE HEIGHT="10%">滚动字幕的高度是可视页面的10%</MARQUEE> 
    <MARQUEE HEIGHT="12">滚动字幕的高度是12像素</MARQUEE> 
      
    WIDTH:用于设定字幕的宽度,宽度可用像素或可视页面的百分比来表示。此属性不是必须使用的。 
    例: 
    <MARQUEE WIDTH="90%">滚动字幕的宽度是可视页面的90%</MARQUEE> 
    <MARQUEE WIDTH="200">滚动字幕的宽度是200像素</MARQUEE> 
      
    HSPACE:用于设定滚动字幕左右的空白空间,空白空间用像素表示。此属性不是必须使用的。 
    例: 
    <MARQUEE HSPACE="15">滚动字幕左右空白空间为15个像素</MARQUEE> 
     
    VSPACE:用于设定滚动字幕上下的空白空间,空白空间用像素表示。此属性不是必须使用的。 
    例: 
    <MARQUEE VSPACE="2">滚动字幕上下的空白空间为2个像素</MARQUEE> 
     
    LOOP:用于设定滚动字幕的滚动次数。当LOOP的值为"INFINITE"或是"-1"时,则文字会无限制地滚动。此属性不是必须使用的。 
    例: 
    <MARQUEE LOOP="-1">文字滚动无数次</MARQUEE> 
    <MARQUEE LOOP="5">文字滚动5次</MARQUEE> 
   
    SCROLLAMOUNT:用于设定每个连续滚动文本后面的间隔,该间隔用像素表示。此属性不是必须使用的。 
    例: 
    <MARQUEE SCROLLAMOUNT="10">此文本后面的间隔为10个像素</MARQUEE> 
      
    SCROLLDELAY:用于设定两次滚动操作之间的间隔时间,该时间以毫秒为单位。此属性不是必须使用的。 
    例: 
    <MARQUEE SCROLLDELAY="5">此文本两次滚动之间的间隔时间为5毫秒</MARQUEE>

ONMOUSEOUT=this.start() :用来设置鼠标移出该区域时继续滚动
        ONMOUSEOVER=this.stop():用来设置鼠标移入该区域时停止滚动
javascript实现连续滚动








var speed=30
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetTop-demo.scrollTop

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

经典论坛的消息滚动

var marqueeContent=new Array(); //定义一个数组,用来存放显示内容
marqueeContent[0]='刷新最新列表';
marqueeContent[1]='站点最新更新六十条';
marqueeContent[2]='羽毛效果制作教程';
marqueeContent[3]='MySQL&ASP';
marqueeContent[4]='初步了解CSS3';
marqueeContent[5]='Fireworks MX 2004执行面版操作';
marqueeContent[6]='Fireworks MX 2004等高渐变填充';
marqueeContent[7]='瓶子里的花';
marqueeContent[8]='Fireworks MX 实现选项卡式效果';
marqueeContent[9]='情侣:黑白的爱情空气';
marqueeContent[10]='制作 MAC 风格的苹果标志';
marqueeContent[11]='蛋壳制作及破壳而出的人物合成';

var marqueeInterval=new Array(); //定义一些常用而且要经常用到的变量
var marqueeId=0;
var marqueeDelay=4000;
var marqueeHeight=20; //滚动高度

//接下来的是定义一些要使用到的函数
Array.prototype.random=function() {
var a=this;
var l=a.length;
for(var i=0;i0?'  ':'')+marqueeContent[i];
document.write('

'+str+'

');
marqueeId+=2;
if(marqueeContent.length>3)marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay);
}
function reinitMarquee() {
js_scroll_content.src='scroll_content2.js';
marqueeContent=marqueeContent.random();
var str='';
for(var i=0;i0?'  ':'')+marqueeContent[i];
marqueeBox.childNodes[(marqueeBox.childNodes.length==1?0:1)].innerHTML=str;
marqueeId=2;
}
function startMarquee() {
var str='';
for(var i=0;(i0?'  ':'')+marqueeContent[marqueeId+i];
}
marqueeId+=3;
if(marqueeId>marqueeContent.length)marqueeId=0;

if(marqueeBox.childNodes.length==1) {
var nextLine=document.createElement('DIV');
nextLine.innerHTML=str;
marqueeBox.appendChild(nextLine);
}
else {
marqueeBox.childNodes[0].innerHTML=str;
marqueeBox.appendChild(marqueeBox.childNodes[0]);
marqueeBox.scrollTop=0;
}
clearInterval(marqueeInterval[1]);
marqueeInterval[1]=setInterval("scrollMarquee()",20);
}
function scrollMarquee() {
marqueeBox.scrollTop++;
if(marqueeBox.scrollTop%marqueeHeight==(marqueeHeight-1)){
clearInterval(marqueeInterval[1]);
}
}
initMarquee();

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

a {text-decoration: none;}

var marqueeContent=new Array(); //滚动新闻
marqueeContent[0]='14:25 小泉称若自民党在议会选举中失败
';
marqueeContent[1]='14:25 布什发表广播讲话
';
marqueeContent[2]='14:25 伊斯兰武装炸毁印控克什米尔铁路导致列车出轨
';
marqueeContent[3]='14:25 布雷默:即使抓住了萨达姆也难以结束抵抗行动
';
var marqueeInterval=new Array(); //定义一些常用而且要经常用到的变量
var marqueeId=0;
var marqueeDelay=2000;
var marqueeHeight=18;
//接下来的是定义一些要使用到的函数
function initMarquee() {
var str=marqueeContent[0];
document.write('

'+str+'

');
marqueeId++;
marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay);
}
function startMarquee() {
var str=marqueeContent[marqueeId];
marqueeId++;
if(marqueeId>=marqueeContent.length) marqueeId=0;
if(marqueeBox.childNodes.length==1) {
var nextLine=document.createElement('DIV');
nextLine.innerHTML=str;
marqueeBox.appendChild(nextLine);
}
else {
marqueeBox.childNodes[0].innerHTML=str;
marqueeBox.appendChild(marqueeBox.childNodes[0]);
marqueeBox.scrollTop=0;
}
clearInterval(marqueeInterval[1]);
marqueeInterval[1]=setInterval("scrollMarquee()",20);
}
function scrollMarquee() {
marqueeBox.scrollTop++;
if(marqueeBox.scrollTop%marqueeHeight==(marqueeHeight-1)){
clearInterval(marqueeInterval[1]);
}
}
initMarquee();

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

代码如下:

<!-- #include file="conn.asp" -->
<!-- #include file="online_users.asp" -->
var marqueeContent=new Array();
marqueeContent[0]='<A href="#" onclick="reinitMarquee()">刷新列表</A>';
<%    Dim rs,sql
    CALL online_users
    sql = "SELECT O.userName,U.realName FROM TBL_ONLINE O left join TBL_USER U on O.userName=U.userName ORDER BY O.loginTime DESC"
    Set rs = conn.execute(sql)
    If NOT (rs.eof AND rs.bof) Then
        count=1
        do while not rs.eof
%>
marqueeContent[<%=count%>]='<A href="postMsg_write.asp?postTo=<%=rs("userName")%>"><%=rs("realName")%></a>';
<%            rs.movenext
            count=count+1
        loop
    End If
    rs.close
    set rs=nothing
    conn.close
    set conn=nothing
%>

//code by windy_sk 20040127
var obj_marquee = document.getElementById("marquee");
var marquee_spd = 4000;
var step_c = 0;

function marquee_init() {
var obj_unit = obj_marquee.firstChild;
var n = Math.ceil(parseInt(obj_marquee.style.height) / obj_unit.offsetHeight);
for(var i=0; i= obj_marquee.children[1].offsetTop) {
obj_marquee.scrollTop = 0;
marquee_show();
return;
}
obj_marquee.scrollTop += step;
if(step_c++


这个是广告~~~~~~~~~


这个也是广告~~~~~~~~~~~~~~~~


这个怎么还是广告??????

Windy2000

也给自己做个广告~~~~~~~~~~

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

//qswh's original and modifid by windy_sk 20040120

function reportError(msg,url,line) {
var str = "You have found an error as below: \n\n";
str += "Err: " + msg + " on line: " + line;
alert(str);
return true;
}

window.onerror = reportError;

var obj_marquee = document.getElementById("marquee");
var repeat = null;
var marquee_spd = 50;

function marquee_init() {
var obj_unit = obj_marquee.firstChild;
var marquee_high = parseInt(obj_marquee.style.height);
var marquee_wide = parseInt(obj_marquee.style.width);
var unit_high = obj_unit.offsetHeight;
var unit_wide = obj_unit.offsetWidth;
var m = 0, n = 0, i = 0;
var tmp = null;

m = Math.ceil(marquee_wide / unit_wide);
n = Math.ceil(marquee_high / unit_high);

obj_unit.style.width = marquee_wide * (m+1);
obj_unit.rows[0].cells[0].style.width = obj_marquee.style.width;

for(i=0; i= obj_marquee.children[1].offsetTop) {
obj_marquee.scrollTop -= obj_marquee.firstChild.offsetHeight;
} else {
obj_marquee.scrollTop++;
}
break;
case "down":
if(obj_marquee.scrollTop = obj_marquee.firstChild.rows[0].cells[0].offsetWidth) {
obj_marquee.scrollLeft -= obj_marquee.firstChild.rows[0].cells[0].offsetWidth;
} else {
obj_marquee.scrollLeft++;
}
break;
case "right":
if(obj_marquee.scrollLeft


经典论坛

163.com

21cn.com

Happy new year

Direction1:

Direction2:

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(0)

相关推荐

  • 会移动的文字(Marquee)

    Marquee标记用于在可用浏览区域中滚动文本.这个标记只适用于IE3以后的版的浏览器. 格式: <MARQUEE ALIGN="-" BEHAVIOR="-" BGCOLOR="-" DIRECTION="-" HEIGHT="-" WIDTH="-" HSPACE="-" VSPACE="-" LOOP="-" SCR

  • JavaScript文本特效实例小结【3个示例】

    本文实例讲述了JavaScript文本特效.分享给大家供大家参考,具体如下: 1.标题跑马灯 常常能够在一些新闻网站,或者其他地方,看到文字在一个特定的区域内,来回滚动.一旦超出边界就消失了,那么这些效果是如何做到的呢,今天我们就来讲讲. 图示效果: 源代码: <!doctype html> <html> <head> <meta charset="utf-8"> <style> </style> </hea

  • Marquee配合DIV实现的文字滚动效果代码

    比如本款代码中,它与DIV 的ID配合,实现一个符合W3C标准的文字滚动效果,这里你只需赋给marquee一个id就可以控制文字了,不理解的朋友看代码. 文字成批滚动 我们(jb51.net)提供各类编程源码.书籍教程.JavaScript/CSS特效代码以及常用软件下载等,做有质量的学习型源码下载站. [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • JQuery实现文字无缝滚动效果示例代码(Marquee插件)

    推荐一个JQuery的无缝文字滚动效果,同时也可以滚动图片,也叫做跑马灯效果. 此jquery插件,依托jquery库,能实现各种滚动效果,且让HTML代码符合W3C标准. 使用方法如下: 1.加载javascript. <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src=&quo

  • jquery实现marquee效果(文字或者图片的水平垂直滚动)

    原本在前端html代码中,实现文字或者图片的水平垂直滚定,都是使用的marquee,但随着考虑浏览器的兼容性和符合为w3c的标准,后来想想那还是使用javascript代码来实现.后来又喜欢上了jquery,下面写的内容希望对初学者有些帮助,高手勿喷,但欢迎指导,感激不尽. 原理:无缝滚动的原理,就是利用两个内容相同的容器,来达到欺骗人的视觉的效果.然后通过整个大容器滚动条的左右或者上下的移动来实现滚动.下面附上一张手绘的图,来简要阐述下原理.首先,我们的目的是实现框1中的内容水平向左滚动(向右

  • Vue替代marquee标签超出宽度文字横向滚动效果

    一.npm 安装 如果你想安装插件(自己写的) 安装 # install dependencies npm i marquee-components 使用 在main.js引入 import marquee from 'marquee-components' Vue.use(marquee ); 在页面使用 <template> <div id="app"> <marquee :val="msg"></marquee>

  • javascript 模拟Marquee文字向左均匀滚动代码

    可以实现匀速.无缝.加链接以及其它的修饰效果,本代码就是实现了这一功能,让文字从右至右平滑滚动,滚动宽度.高度.速度均可以设定. Js文字向左运动 var marqueewidth=350 var marqueeheight=22 var speed=5 var marqueecontents='欢迎光临我们 网页特效栏目,精品特效全收罗!' if (document.all) document.write(''+marqueecontents+'') function regenerate()

  • Class Of Marquee Scroll通用不间断滚动JS封装类第1/2页

    制作时间:2006-08-29 (Ver 0.5) 发布时间:2006-08-31 (Ver 0.8) 更新时间:2007-12-28 (Ver 1.65) 更新说明: + 加入功能 * 修正.完善     1.65.071228         * 横向.纵向滚动格式调整 (解决横向滚动换行的问题,无需特殊设置)         * 彻底解决由于IE问题导致上下滚动页面留白的问题 (本次更新主要解决此问题,感谢天上的书生参与测试)     1.6.070131         + 禁止鼠标控制

  • JS与HTML结合使用marquee标签实现无缝滚动效果代码

    最近在做一个前端开发的项目,需要实现无缝滚动效果,上下左右无缝滚动.下面小编把实现代码分享到我们平台,需要的朋友可以参考下,有bug欢迎提出,共同学习进步. 具体代码如下所示: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> <HTML xmlns=&

  • JQuery插件Marquee.js实现无缝滚动效果

    Marquee.js插件提供了许多属性选项,您可以配置定制外观和效果. { yScroll: "top" // 初始滚动方向 (还可以是"top" 或 "bottom") showSpeed: 850 // 初始下拉速度 scrollSpeed: 12 // 滚动速度 , pauseSpeed: 5000 // 滚动完到下一条的间隔时间 pauseOnHover: true // 鼠标滑向文字时是否停止滚动 loop: -1 // 设置循环滚动次

随机推荐