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

 <!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. day48-python爬虫学习三

    Python的urllib和urllib2模块都做与请求URL相关的操作,但他们提供不同的功能.他们两个最显着的差异如下: urllib2可以接受一个Request对象,并以此可以来设置一个URL的h ...

  2. flask 第五章 WebSocket GeventWebsocket 单聊群聊 握手 解密 加密

    1.WebSocket 首先我们来回顾一下,我们之前用socket学习过的项目有: 1.django 2.flask 3.FTP - 文件服务 HTTP - TCP (特点): 1.一次请求,一次响应 ...

  3. DCOMP——分散式计算

    新型网络DCOMP 据国外媒体2017年11月7日报道,曾经发明互联网的秘密机构“美国国防部高级研究计划局(DARPA)”如今正致力于研发能够完胜互联网的新网络,并且启动了一项链接物联网.智能手机.智 ...

  4. ES6标准入门读书笔记

    第一章  基础 1.let和const命令 (1).let用于声明变量,所声明的变量只在当前代码块有效 特点:不存在变量提升     所以在变量声明之前就使用会报错 暂时性死区           只 ...

  5. 使用mybatis-generator工具自动生成mybatis代码

    使用mybatis-generator工具自动生成mybatis代码 步骤如下: 1.引入maven  依赖,在项目pom.xml文件中添加 <plugin> <groupId> ...

  6. Java第一个程序之HelloWorld

    代码实现如下图: 讲解: 1.主方法入口main():public static void main(string[] args){}是Java应用程序执行的入口点,必须提供该方法才能被执行: 2.打 ...

  7. Nginx原理

    原理机制 Nginx采用多进程(每个worker进程只对应一个线程)和I/O多路复用机制,实现并发的事件驱动处理: 多路复用即通过一种机制监视多个文件描述符,一旦文件描述符就绪(读写就绪),就可通知程 ...

  8. git 合并分支到master

    git 合并分支到master   假如我们现在在dev分支上,刚开发完项目,执行了下列命令 git add .git commit -m ‘dev'git push -u origin dev 然后 ...

  9. windows下安装memcached,报错:Failed to ignore SIGHUP RESULT too large

    小平板不想装虚拟机, 但是却跑不起memcached 网上虽有解决方案,但都只有一条命令, 没有出处. 翻了半天, 找到这个连接 https://commaster.net/content/insta ...

  10. dos4章

    批处理中的变量,我把他分为两类,分别为"系统变量"和"自定义变量" 我们现在来详解这两个变量! 一.系统变量 他们的值由系统将其根据事先定义的条件自动赋值,也就 ...