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

滚动的文字

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

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

弹来弹去跑马灯!

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

源码粘贴框:

弹来弹去跑马灯!

2、跑的很快的跑马灯

跑的很快跑马灯!

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

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

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

源码粘贴框:

带有超链接的跑马灯!点我试试?

还有一条呢!点我试试?

以上几个例子都是标签参数的应用,下面把所有可以利用的参数列在表中供你参考,不过还是要提醒你,标签只被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

跑马区域的背景颜色

你已经看到,尽管参数不少,单毕竟不能实现复杂的和自定义的特殊跑马灯效果,而且还有浏览器限制,所以我们更多情况下会采用JavaScript来实现跑马灯,那就是我们下一个技巧的内容。

html制作跑马灯,html跑马灯制作相关推荐

  1. 兄弟们,快醒醒,我们的跑马灯不跑了。

    销售GG在工作群里:"弟兄们,快醒醒,咱现场的跑马灯不跑了." 还在加班的程序猿:"已经查过了,程序没Bug." 带娃玩的硬件攻城狮:"硬件没问题,这 ...

  2. python制作简单网页_python 跑服务器,访问自己制作的简单页面

    1 python 跑服务器,访问自己制作的简单页面 2 # win+b出现一个网址http:/0.0.1:5000/复制到浏览器查看 # http://127.0.0.1:5000/home 做这个首 ...

  3. 【游戏开发实战】(完结)使用Unity制作像天天酷跑一样的跑酷游戏——第七篇:游戏界面的基础UI

    文章目录 一.前言 二.导入游戏界面UI素材 三.制作游戏界面UI预设 四.事件管理器 五.编写GameMainPanel.cs脚本 六.游戏管理器添加金币逻辑 七.加金币 八.跳跃事件 九.运行测试 ...

  4. 【游戏开发实战】使用Unity制作像天天酷跑一样的跑酷游戏——第一篇:人物动画序列帧

    文章目录 一.前言 二.创建工程 三.导入序列帧图片素材 四.设置图片格式 五.切割序列帧 六.制作序列帧动画 七.运行效果 一.前言 嗨,大家好,我是新发,今天是大年初一,大家牛年快乐,牛气冲天. ...

  5. 【游戏开发实战】使用Unity制作像天天酷跑一样的跑酷游戏——第三篇:跑酷地面制作

    文章目录 一.前言 二.导入地面素材 三.制作地面预设 四.使用脚本控制地面移动 五.起始和结束位置 六.复制多个地面预设 七.运行效果 一.前言 嗨,大家好,我是新发,今天是大年初三,大家牛年快乐, ...

  6. 【游戏开发实战】使用Unity制作像天天酷跑一样的跑酷游戏——第二篇:使用Animator控制跑酷角色的动画状态切换

    文章目录 一.前言 二.制作一段跳.二段跳动画 三.编辑动画控制器 四.运行效果 一.前言 嗨,大家好,我是新发,今天是大年初二,大家牛年快乐,牛气冲天. 我打算写一篇使用Unity制作像天天酷跑一样 ...

  7. 【游戏开发实战】使用Unity制作像天天酷跑一样的跑酷游戏——第六篇:金币创建与吃金币

    文章目录 一.前言 二.导入金币图片素材 三.制作金币预设 四.制作多个形状的金币阵列 五.金币创建器 六.运行测试 一.前言 嗨,大家好,我是新发. 我打算写一篇使用Unity制作像天天酷跑一样的游 ...

  8. 【游戏开发实战】使用Unity制作像天天酷跑一样的跑酷游戏——第四篇:使用脚本控制跑酷角色

    文章目录 一.前言 二.给角色添加碰撞器 三.给地面设置Tag 四.创建Player脚本 五.运行测试 一.前言 嗨,大家好,我是新发,今天是大年初五,大家牛年快乐,牛气冲天. 我打算写一篇使用Uni ...

  9. 【游戏开发实战】使用Unity制作像天天酷跑一样的跑酷游戏——第五篇:游戏结束与重新开始

    文章目录 一.前言 二.制作边界碰撞体 三.制作游戏结束界面 四.游戏结束界面脚本 五.游戏管理器 六.碰撞检测逻辑 七.运行测试 一.前言 嗨,大家好,我是新发. 我打算写一篇使用Unity制作像天 ...

  10. CSS+JavaScript制作文字的LED跑马灯效果

    以下是html代码: <head><meta charset="utf-8" /><title>文字跑马灯</title><l ...

最新文章

  1. 【数理知识】第9章-树-《离散数学及其应用》Kenneth H. Rosen
  2. Matlab中transpose函数的使用
  3. http的302,303和307
  4. 定义[nextTick、事件循环]
  5. 5大过程组与整体管理
  6. python正则匹配字符串中的数字_Python正则表达式匹配字符串中的数字
  7. 使用Css隐藏超出容器宽度的文字,溢出部分用“...”表示
  8. 【笔记】LR配置ODBC连接数据库进行参数化(mysql )未完待续
  9. 基于sklearn 的one hot encoding
  10. paip.cache 缓存架构以及性能提升总结
  11. 1-一、安装NVIDIA控制面板
  12. linux加载显卡驱动模块,linux怎样加载显卡驱动,急,在线等
  13. 鸿鹄818芯片:小米电视千万销量面前的“水滴”
  14. SQL 2008下载地址以及全新安装详细过程
  15. Oracle常用文档整理
  16. 微软surface屏幕测试软件,Soomal作品 - Microsoft 微软 Surface Go平板电脑屏幕测评报告 [Soomal]...
  17. BAPI_ALM_ORDER_MAINTAIN 修改维修工单组件示例
  18. SqlServer数据库应用
  19. 电影《在云端》经典对白翻译
  20. linux操作系统原理_Linux后台开发C++学习路线技能加点,已拿鹅厂offer

热门文章

  1. oracle下载历史版本,ORACLE老版本下载地址
  2. python写字_用Python写书法作品,WOW!
  3. C程序设计实践——实验指导
  4. 处女座与cf 模拟
  5. c语言实例100_pic单片机,PIC单片机C语言编程实例
  6. 研究生们都在推荐哪些好用的论文在线翻译软件?
  7. cuda必须装在c盘吗_善待你的系统盘——系统盘(C盘)解决方案
  8. 自动控制原理知识点梳理——整体框架
  9. 《JAVA程序设计基础(第3版)实验指导》pdf 附下载链接
  10. 通过网页链接调用QQ临时会话实现