跑马灯js
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
#scrollobj01,#scrollobj02 {
white-space: nowrap;
overflow: hidden;
width: 390px;
} </style>
<script type="text/javascript">
window.onload=function(){ alert(id("scrollobj01")); var _timer = setInterval("scroll01(id('scrollobj01'))", 10);
function _stop01() {
if (_timer != null) {
clearInterval(_timer);
}
}
function _start01() {
_timer = setInterval("scroll01(id('scrollobj01'))", 10);
} }
function id(name){ return document.getElementById(name); }
function scroll01(obj) {
/*往左*/
var tmp = (obj.scrollLeft)++;
//当滚动条到达右边顶端时
if (obj.scrollLeft == tmp) {
obj.innerHTML += obj.innerHTML;
}
//当滚动条滚动了初始内容的宽度时滚动条回到最左端
if (obj.scrollLeft >= obj.firstChild.offsetWidth) {
obj.scrollLeft = 0;
}
} </script>
</head> <body>
<div > <!--重点工作-->
<div class="gdxw" style="width:510px; margin-top:3px;">
<img src="file:///C|/Users/Administrator/Desktop/images/gdxl_tp2.gif" width="115" height="22" style="float:left;" />
<div id="scrollobj01" onmouseover="javascript:_stop01();" onmouseout="javascript:_start01();" style="float:left; width:390px; font-size:14px; font-family:'宋体'; color:#ff0214;"> <a href="file:///C|/Users/Administrator/Desktop/${document.fileName}?id=${document.id}" target="_blank" style="color:#FF0214;"><b>${document.title}</b></a> </div> </div>
<!--干部考勤情况--> <div class="gdxw" style="width:510px; margin-top:3px;">
<img src="file:///C|/Users/Administrator/Desktop/images/gdxl_tp2.gif" width="115" height="22" style="float:left;" />
<div id="scrollobj02" onmouseover="javascript:_stop02();" onmouseout="javascript:_start02();" style="float:left; width:390px; font-size:14px; font-family:'宋体'; color:#ff0214;"> <a href="file:///C|/Users/Administrator/Desktop/${document.fileName}?id=${document.id}" target="_blank" style="color:#FF0214;"><b>${document.title}</b></a> </div> </div>
</div>
</body>
</html>
跑马灯js的更多相关文章
- js_跑马灯
跑马灯?刚听到这个词的时候,脑袋第一个想到的是跑马?嗯?就是香港的那种跑马场.懂?其次就是霓虹灯了,一闪一闪的多好看. 霓虹灯?哦,那是城市的杰作,记忆中是.开往城市边缘开,把车窗都摇下来,用速度换一 ...
- js抽奖跑马灯程序
js抽奖跑马灯程序 点击下载代码
- JS跑马灯
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEA ...
- javascript小记五则:用JS写一个图片左右自由滚动的“跑马灯”效果
之前看了很多百度搜索出的东西,十个有九个是不能实用的,个个讲的都不详细,今天详细给大家讲解下关于这个图片“跑马灯”滚动效果,源码如下: <!DOCTYPE html PUBLIC "- ...
- 使用 JS 实现文字左右跑马灯
Ø 前言 其实,前面两篇已经基本上实现了图片.文字跑马灯,这里为什么还要学下文字左右跑马灯呢?因为,虽然基本一样,但实现起来还是有很大不同的,所以为了完整再补充一下.代码如下: 1. 首先定义 ...
- 使用 JS 实现图片左右跑马灯
Ø 前言 之前写了一篇使用 JS 实现文字上下跑马灯,现在乘热打铁在把图片左右跑马灯一起贴出来,不多说直接看代码. 1. 首先定义 css 样式 <style type="tex ...
- 使用 JS 实现文字上下跑马灯
Ø 前言 今天在做商城首页时,遇到一个上下跑马灯功能,因为之前也只是接触过左右的跑马灯,一时还不知道从何下手.在网上看了几个 demo,并亲自运行了一下,是可以实现的.但是,能运行不知其所以然也不行 ...
- js+css简单效果(幕布,跑马灯)
2.js普通的盒子,css的优先级 css的优先级 !important >>>>> style 行内样式 >>>>> #id选择器 # ...
- JS实现跑马灯效果(向左,向上)
<html> <head> <title>JS实现跑马灯效果</title> <style> * { font-size:12px; fon ...
随机推荐
- ScriptManager的使用方法
脚本管理控件(ScriptManger)是ASP.NET AJAX中很重要的控件,通过使用ScriptManger可以进行整个页面的局部更新的管理.ScriptManger用来处理页面上局部更新,同一 ...
- Spring 3 + Quartz 1.8.6 Scheduler Example--reference
In this tutorial, we will show you how to integrate Spring with Quartz scheduler framework. Spring c ...
- 数据存储简单了解(NSUserDefaults)
数据存储-使用NSUserDefaults 两个类介绍: NSUserDefaults适合存储轻量级的本地数据,比如要保存一个登陆界面的数据,用户名.密码之类的,个人觉得使用NSUserDefault ...
- php5.2通过saprfc扩展远程连接sap730成功案例
公司刚上sap系统,由于资金有限,sap与其它系统的数据交换需要公司内部实现.于是,领导决定入库申请流程需要在sap与OA系统里实现电子签核流,重担果然落到我的身上.好在我只负责OA,还一位同事负责s ...
- PHP 关于文件操作的简单介绍
文件操作一直是Web程序员头疼的地方,而文件操作在CMS这样的系统中又是必须的.如今,PHP文件操作的函数内容已经非常强大,文件这部分也是学习PHP非常重要的一部分,希望大家不要忽略.这篇文章会简单介 ...
- C# 汉字的字符串截取指定字节的长度
int index = 0; int setCharCount = 74; string str1 = "三星 SCH-I829 电信3G手机(优 ...
- windowIsTranlucent 属性
项目中踩的大坑. 先埋. int alwaysFinish = 0; if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERS ...
- win7+SQL2008无法打开物理文件 操作系统错误 5:拒绝访问 SQL Sever
今天在win7+SQL2008的环境下操作分离附加数据库,分离出去然后再附加,没有问题.但是一把.mdf文件拷到其它文件夹下就出错,错误如下:无法打开物理文件 "E:\db\MyDB.mdf ...
- 修改一行SQL代码 性能提升了N倍
在PostgreSQL中修改了一行不明显的代码,把(ANY(ARRAY[...]) 改成 ANY(VALUES(...))),结果查询时间从20s变为0.2s.最初我们学习使用EXPLAN ANALY ...
- 面向对象设计模式之TemplateMethod模板方法(行为型)
动机:在软件构建过程中,对于某一项任务,他常常有稳定的整体操作结构,但各个子步骤却有很多改变的需求,或者由于固有的原因(比如框架与应用之间的关系)而无法和任务的整体结构同时实现:如何在确定稳定操作结构 ...