<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<div id="i2">欢迎马老师到来，观察做出指导。</div>

<input id="i1" style="width: 80px;" value="欢迎马老师到来，观察做出指导。" >

<script type="application/javascript">

    content = document.getElementById("i1").getAttribute("value")

    setInterval("gun()",1000)

    var i = 0

    function gun() {

        document.getElementById("i1").setAttribute("value",content.substring(i,i+6))

        i++

        if ( i == content.length - 6){

            i = 0

        }

    }

</script>

<script>

    setInterval("gun2()",500);

    function gun2() {

        var tag = document.getElementById('i2');

        var content = tag.innerText;

        f = content.charAt(0);

        l = content.substring(1,content.length);

        new_content = l + f;

        tag.innerText = new_content;

    }

</script>

</body>

</html>

　　

js 实现滚动字幕的更多相关文章

  1. HTML滚动字幕代码参数详解及Js间隔滚动代码

    html文字滚动代码 <marquee style="WIDTH: 388px; HEIGHT: 200px" scrollamount="2" dire ...

  2. js原生 + jQuery实现页面滚动字幕

    js原生/jQuery实现页面滚动字幕效果 17:45:49 在新闻列表或者文章列表信息等页面中很容易要求实现字幕滚动的效果,以下为简单的实现页面中滚动字幕的效果 1.jQuery实现页面滚动字幕效果 ...

  3. js平滑滚动到顶部,底部,指定地方

    [原文链接] 采用锚点进行页面中的跳转的确很方便,但是要想增加网页的效果,可以使用jquery中的animate,实现滚动的一个动作,慢慢的滚动到你想跳转到的位置,从而看起来会非常高大上. [示例演示 ...

  4. js左右滚动幻灯

    js左右滚动幻灯 点击下载

  5. UILabel滚动字幕的实现

    经常需要在应用中显示一段很长的文字,比如天气或者广告等,这时候使用滚动字幕的方式比较方便. 参考文献: [1] YouXianMing, 使用UILabel实现滚动字幕移动效果, 博客园 [2] ht ...

  6. 手写JS无缝滚动插件

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  7. C#-循环滚动字幕,timer,从左至右,从右至左,暂停---ShinePans

    Lable的Left属性是能够更改的,可是 Right属性不能够更改,所以我们能够利用 这个特点做自加 自减运算 using System; using System.Collections.Gene ...

  8. DS控件库 DSLed控件呈现滚动字幕效果

    滚动字幕效果在DSled上可以使用偏移来实现,代码如下 运行效果

  9. JS鼠标滚动插件scrollpath使用介绍

    JS鼠标滚动插件scrollpath:在这个插件中首先要引人的JS是jQuery,因为后面的JS都是基于它的.再者需要引入的是jquery.scrollpath.js.scrollpath.css还有 ...

随机推荐

  1. Javascript将数据转成英文书写格式

    var aTens = [ "TWENTY", "THIRTY", "FORTY", "FIFTY", "SI ...

  2. POJ 2001 Shortest Prefixes（字典树）

    Description A prefix of a string is a substring starting at the beginning of the given string. The p ...

  3. [转]自然语言处理中的Attention Model：是什么及为什么

    自然语言处理中的Attention Model:是什么及为什么 https://blog.csdn.net/malefactor/article/details/50550211 /* 版权声明:可以 ...

  4. 20165228 2017-2018-2 《Java程序设计》第8周学习总结

    20165228 2017-2018-2 <Java程序设计>第8周学习总结 教材学习内容总结 进程与线程的关系 多线程的运行机制 线程的四种状态:新建.运行.中断.死亡 使用Thread ...

  5. java list 的遍历

    import java.util.ArrayList; import java.util.Arrays; import java.util.Collection; import java.util.I ...

  6. HPU组队赛J：Ball King（线段树）

    时间限制 1 Second  内存限制 512 Mb 题目描述 HPU601球王争霸赛即将举行,ACMER纷纷参加. 现在有n个人报名参赛,每个人都有一个实力值 ai,实力值较大者获胜. 为保证比赛公 ...

  7. BFS深度优先搜索 炸弹人

    题面:一个人在一个坐标放炸弹,请问可以可以杀死的敌人数目最大是,并且输出该点的坐标 G代表敌人 .代表该位置可以走 "#"代表该位置存在障碍物 并且防止炸弹的蔓13 13 3 3 ...

  8. struts2文件上传1

    <form action="hello/UploadAction_upload.action" enctype="multipart/form-data" ...

  9. Python知识点整理，基础4 - 集合操作

  10. Queue接口的实现类竟然有一个是LinkedList，一个是优先队列(同一个接口，只改了不同的实现类，附源码)

    输出是: Queue接口底层换一个实现类,照样的是调用Queue接口中的方法 import java.util.HashMap; import java.util.LinkedList; import ...