注册 | 登录 | 控制面板 | 会员列表 | 搜索 | 投稿 | 留言本  
繁体中文
设为首页
加入收藏
当前位置: 首页 >> 平面艺术 >> 网页制作技巧
网页制作技巧

作者:      来源:     发表时间:2005-10-13     浏览次数:     字号:    

实现跑马灯的方法很多,其中最简单的是采用一句Html代码来实现,我们在需要出现跑马灯效果的地方插入“<marquee>滚动的文字</marquee>”语句,它的效果如下所示:

滚动的文字

  适当的运用<marquee>标签的参数,可以表现出不同的效果,请看下面的几个例子:

  1、左右弹来弹去的跑马灯

弹来弹去跑马灯!

  实现的方法就是在IE的标签上稍微多加了几个参数产生了更加丰富的变化。设置behavior=alternate表示双向移动,direction=left表示运动方向向左。marquee的宽度可以使用绝对象素值,例如width=200等这个值限定了跑马灯滚动的范围。需要说明的是该效果在Netscape下是看不到的。

  源码粘贴框:<marquee width=400 behavior=alternate direction=left align=middle border=1>弹来弹去跑马灯!</marquee>
 2、跑的很快的跑马灯

跑的很快跑马灯! 

  只要在<marquee>标签内加上“scrollamount=30”参数即可。

  3、带有超级链接的跑马灯

带有超链接的跑马灯!点我试试?          还有一条呢!点我试试? 

  其实实现的方法很简单,把整个<marquee></marquee>语句包含在超链接中就行,你看看下面的代码就清楚了。当然你也可以把包含在<marquee></marquee>中的各条内容分别加上不同的链接,这样的跑马灯用来发布滚动新闻或是做站点导航再合适不过了。

  源码粘贴框:<marquee width=90%>
<a href="http://www.hongen.com/default.htm" target=_blank>带有超链接的跑马灯!点我试试?</a>
          <a href="http://www.hongen.com/pc/index.htm" target=_blank>还有一条呢!点我试试?</a>
</marquee>

  以上几个例子都是<marquee>标签参数的应用,下面把所有可以利用的参数列在表中供你参考,不过还是要提醒你,<marquee>标签只被IE所支持,使用Netscape浏览器是看不到的噢。

参数 用法介绍
behavior=scroll, slide, alternate 跑马方式:循环绕行,只跑一次就停住,来回往复运动
direction=left,right 跑马方向:从左向右,从右向左
loop=100 跑马次数:循环100次,如不写默认为一直循环
width=100%,height=200 跑马范围:宽为100%,高为200像素
scrollamount=20 跑马速度:数越大越快
scrolldelay=500 跑马延时:毫秒数,利用它可实现跃进式滚动
hspace=20,vspace=20 跑马区域与其它区域间的空白大小
bgcolor=#00FFCC 跑马区域的背景颜色

责任编辑:
发表评论  打印本文  推荐本文  加入收藏  返回顶部  关闭窗口

  • 上一篇: IE八大经典故障解决
  • 下一篇: Photoshop技巧148条
  • □ 最新文章
    普通文章  用iframe实现网页的内嵌... 08-25
    普通文章  ASP中巧用Response属性 08-25
    普通文章  google老总李开复 02-24
    普通文章  百度老总李彦宏 02-24
    普通文章  Windows走过20周年! 02-22
    普通文章  Photoshop菜单中英文对照 10-14
    普通文章  包装设计的构思 10-14
    普通文章  包装设计中的视觉色彩的... 10-14
    普通文章  网站设计风格和色彩搭配... 10-14
    普通文章  第四章 平面构成的方法 10-14
    □ 推荐文章
    精华文章  Photoshop 鲜为人知的7... 10-14
    □ 热点文章
    普通文章  百度老总李彦宏 02-24
    普通文章  google老总李开复 02-24
    普通文章  第四章 平面构成的方法 10-14
    普通文章  第二章 平面构成中最基... 10-14
    普通文章  平面构成基础知识 10-14
    普通文章  包装设计中的视觉色彩的... 10-14
    精华文章  Photoshop 鲜为人知的7... 10-14
    普通文章  网页制作技巧 10-13
    普通文章  包装设计的构思 10-14
    普通文章  Windows走过20周年! 02-22
       发表评论 更多评论>>
       发表评论
    姓名: QQ:
    性别: MSN:
    E-mail: 主页:
    评分: 1 2 3 4 5
    评论内容:
      
  • 请遵守《互联网电子公告服务管理规定》及中华人民共和国其他各项有关法律法规。
  • 严禁发表危害国家安全、损害国家利益、破坏民族团结、破坏国家宗教政策、破坏社会稳定、侮辱、诽谤、教唆、淫秽等内容的评论 。
  • 用户需对自己在使用本站服务过程中的行为承担法律责任(直接或间接导致的)。
  • 本站管理员有权保留或删除评论内容。
  • 评论内容只代表网友个人观点,与本网站立场无关。
  • ·关于我们 ·联系方式
    © 电脑e路通(e6tong.net) 2005 All rights reserved