<!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. python 基础 内置函数 和lambda表达式

    1.把任意数值转化为字符串有两种方法. (1)str()用于将数值转化为易于人读的形式.print(str("我是中国人"))>>>我是中国人 (2)repr() ...

  2. Spring Boot 揭秘与实战（二） 数据存储篇 - 数据访问与多数据源配置

    文章目录 1. 环境依赖 2. 数据源 3. 单元测试 4. 源代码 在某些场景下,我们可能会在一个应用中需要依赖和访问多个数据源,例如针对于 MySQL 的分库场景.因此,我们需要配置多个数据源. ...

  3. http --爬虫

    http模块可以创建服务器, var http=require('http'); var path=require('path'); var fs=require('fs'); http.get(ur ...

  4. threejs path controls example html

    <!DOCTYPE html> <html lang="en"> <head> <title>three.js webgl - pa ...

  5. 什么是PT，PT和BT有什么不同？

    答:PT(Private Tracker)下载其实也是Bt下载的一种,但有两个明显的改进:一是私密的小范围下载,二是进行流量统计,根据上载量决定你的权限. BT下载时,软件会分析.torrent种子文 ...

  6. git get submodule after clone

    /********************************************************************************* * git get submodu ...

  7. NYOJ 12：喷水装置（二）（贪心，区间覆盖问题）

    12-喷水装置(二) 内存限制:64MB 时间限制:3000ms 特判: No 通过数:28 提交数:109 难度:4 题目描述: 有一块草坪,横向长w,纵向长为h,在它的橫向中心线上不同位置处装有n ...

  8. 相对和绝对路径 mkdir cd rm 等命令

     1. 绝对路径和相对路径    个人理解: 绝对路径-----即从根目录开始一直到你需要找的文件或目录的路径 (即任何情况下都以根目录为起点) 相对路径------即从当前目录开始一直找到你需要找的 ...

  9. Android系统备忘1

    Android的4种模式 模式 功能 ADB调试system 正常使用 开发者模式开启usb调试recovery 备份,恢复模式 卡刷模式 twrp下开启ADB Sideloadfastboot 线刷 ...

  10. hdu4847 Wow! Such Doge! KMP

    Chen, Adrian (November 7, 2013). “Doge Is An Ac- tually Good Internet Meme. Wow.”. Gawker. Retrieved ...