---恢复内容开始---

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

 </head>

 <body>

 <div id="hsn">欢迎各位领导莅临指导</div>

 </body>

  <script >

      function func(){   //创建函数

          var str = document.getElementById('hsn');//获取id属性为hsn的模块句柄

          var l = str.innerText.charAt(0);//对该模块进行文本内容第一个元素读取

          var f = str.innerText.substring(1,str.length);//截取该文本2到最后一个文本

          var new_str = f+l ;//将l和f进行拼接成新的字符串

          str.innerText = new_str;//对该模块文本进行修改，修改为新拼接的字符串

      } ;

      setInterval('func()',1000);//调用循环定时器函数启动该函数，并延长1秒无限循环。

     </script>

 </html>

我可以用这个跑马灯给我的博客首页加个跑马灯试试，哈哈哈哈哈。太爽了，我取试试。

---恢复内容结束---

javascript之网页跑马灯的更多相关文章

  1. JavaScript实现文字跑马灯

    其实实现文字的跑马灯和实现图片轮播的原理是一样的. 下面是我自己实现的,文字的位置可以随便更改,效果不会变,文字的内容可以通过ajax获取,同时,可以直接用Jquery改写一下,很方便. <!D ...

  2. html跑马灯效果

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

  3. html跑马灯/走马灯效果

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

  4. marquee标签实现跑马灯效果--无缝滚动

    今天在做微信端的大转盘抽奖时,想把所有用户的抽奖记录做成无缝滚动的效果,无奈我的js功底太差,一时想不出实现的方法,便百度各种相似效果.但无意中发现了一个html标签——<marquee> ...

  5. JavaScript “跑马灯”抽奖活动代码解析与优化（一）

    最近的项目中做了一个"跑马灯"的抽奖特效插件.上篇文章已经分享过html和css 的相关知识.这篇文章主要分享一些 JavaScript 相关的知识.这几天在写这篇文章的时候,也顺 ...

  6. javascript小记五则：用JS写一个图片左右自由滚动的“跑马灯”效果

    之前看了很多百度搜索出的东西,十个有九个是不能实用的,个个讲的都不详细,今天详细给大家讲解下关于这个图片“跑马灯”滚动效果,源码如下: <!DOCTYPE html PUBLIC "- ...

  7. JavaScript “跑马灯”抽奖活动代码解析与优化（二）

    既然是要编写插件.那么叫做"插件"的东西肯定是具有的某些特征能够满足我们平时开发的需求或者是提高我们的开发效率.那么叫做插件的东西应该具有哪些基本特征呢?让我们来总结一下: 1.J ...

  8. 【HTML】 向网页<Title></Title>中插入图片以及跑马灯

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style typ ...

  9. JavaScript小实例-文字跑马灯效果

    我们常常能看到显示屏上字体的滚动以及手机弹幕等,下面所示代码就是一个简易的文字跑马灯的效果: <!DOCTYPE html> <html> <head lang=&quo ...

随机推荐

  1. 《用Python写爬虫》学习笔记（二）编写第一个网络爬虫

    1.首先,下载网页使用Python的urllib2模块,或者Python HTTP模块request来实现 urllib2会出现问题,解决方法1.重试下载(设置下载次数) 2.设置用户代理 2.其次, ...

  2. Python深入理解yield

    yield的英文单词意思是生产,刚接触Python的时候感到非常困惑,一直没弄明白yield的用法. 只是粗略的知道yield可以用来为一个函数返回值塞数据,比如下面的例子: def addlist( ...

  3. Python-接口自动化（八）

    unittest单元测试框架(八)    (九)unittest 1.基本概念 python自带的unittest单元测试框架不仅可以适用于单元测试,也适用于WEB自动化测试用例的开发与执行,uint ...

  4. ES(Elasticsearch)

    基本概念 Elasticsearch是一个实时分布式搜索和分析引擎 支持: 全文搜索 结构化搜索 分析 可以这样进行描述: 分布式的实时文件存储,每个字段都被索引并可被搜索 分布式的实时分析搜索引擎 ...

  5. Redis安装部署教程

    1)下载 redis-3.2.9.tar.gz 2)用ssh工具连接目录主机,在命令窗口输入:mkdir -p /opt/redis创建redis文件夹 3)通过WinSCP工具将redis-3.2. ...

  6. complex类的定义和实现

    #include<iostream> #include<cmath> using namespace std; class complex { public: complex( ...

  7. DevExpress v18.2版本亮点——Reporting篇（三）

    行业领先的.NET界面控件——DevExpress v18.2日前正式发布,本站将以连载的形式为大家介绍新版本新功能.本文将介绍了DevExpress Reporting v18.2 的新功能,新版3 ...

  8. Codeforces Round #554 (Div. 2) C. Neko does Maths (简单推导)

    题目:http://codeforces.com/contest/1152/problem/C 题意:给你a,b, 你可以找任意一个k     算出a+k,b+k的最小公倍数,让最小公倍数尽量小,求出 ...

  9. 如何在一台计算机上配置多个jdk【转】

    分析问题 为了多快好省的解决当前的问题,我的想法是在windows中同时安装jdk1.6和jdk1.8,在中间进行切换,而不需要多次进行重复的安装和卸载,这样简单方便. 解决思路 第一步:在安装之前, ...

  10. c语言实现两个单链表的交叉合并

    #include<stdio.h> #include<stdlib.h> #include<iostream> using namespace std; struc ...