js代码跑马灯效果-----轮播图字效果!
文字元素:
<p id="yc-msg">你有本事来打我呀!</p>
js执行代码:
function ycMsg() {
    // 获取 标签
    var pObj = document.getElementById('yc-msg');
    // 获取文字内容
    var text = document.getElementById('yc-msg').innerText;
    timeID = setInterval(() => {
        var start = text.substring(0, 1);
        var end = text.substring(1);
        // 拼接字符串
        text = end + start;
        // 更换符号内容---
        pObj.innerHTML = text;
    }, 400);
}
ycMsg();//调用函数
已经完成效果!
js代码跑马灯效果-----轮播图字效果!的更多相关文章
- js 实现淘宝无缝轮播图效果,可更改配置参数 带完整版解析代码[slider.js]
		前言: 本人纯小白一个,有很多地方理解的没有各位大牛那么透彻,如有错误,请各位大牛指出斧正!小弟感激不尽. 本篇文章为您分析一下原生JS写淘宝无缝轮播图效果 需求分析: ... 
- 原生JS实现轮播图的效果
		原生JS实现轮播图的效果: 只要缕清了全局变量index的作用,这个轮播图也就比较容易实现了:另外,为了实现轮这个效果,有几处clearInterval()必须写上.废话不多说,直接上代码,修复了几个 ... 
- 【前端】javascript+jQuery实现旋转木马效果轮播图slider
		实现效果: 实现原理: 技术栈: javascript+jQuery+html+css 实现步骤: // 0. 获取元素 // 1. 鼠标放置到轮播图上,显示两侧的控制按钮,移开后隐藏 // 2. 为 ... 
- JS封装动画框架,网易轮播图,旋转轮播图
		JS封装动画框架,网易轮播图,旋转轮播图 1. JS封装运动框架 // 多个属性运动框架 添加回调函数 function animate(obj,json,fn) { clearInterval(ob ... 
- 使用JS实现轮播图的效果
		其中的一些css样式代码就省略了,下面只把结构层html.行为层js的代码展示出来 ,看代码说事. 一.简单的轮播图 <div class="box" id="bo ... 
- jquery里面的attr和css来设置轮播图竟然效果不一致
		/*封装$*/ // window.$=HTMLElement.prototype.$=function(selector){ // var elems=(this==window?document: ... 
- 原生js实现简单移动端轮播图
		最近项目不是很忙,自己就用原生js写了一个简单的移动端轮播图的小demo,可实现自动轮播和手势滑动轮播,然后就把它记录到个人博客里.还有很多不足的地方,希望多多指出,以便改进. 1.代码部分 分为四个 ... 
- jQuery淡入淡出效果轮播图
		用JavaScript做了平滑切换的焦点轮播图之后,用jQuery写了个简单的淡入淡出的轮播图,代码没有做优化,html结构稍微有一些调整,图片部分用ul替换了之前用的div. html结构如下: & ... 
- JS应用实例2:轮播图
		在学习轮播图之前,要先会切换图片: 找三张图片,命名1.jpg,2.jpg,3.jpg 示例: <!DOCTYPE html> <html> <head> < ... 
随机推荐
- 201771010134杨其菊《面向对象程序设计java》第十二周学习总结
			第十二周学习总结 第一部分:理论知识 内容概要: AWT与Swing简介:框架的创建:图形程序设计: 显示图像: 1.AWT组件: 2.Swing 组件层次关系 3 .AWT与Swing的关系:大部分 ... 
- DataTables warning : Requested unknown parameter '0' from the data source for row 0错误
			在做datatables的项目,从后台取得数据后,返回给datatables界面时会报下面的错误: DataTables warning : Requested unknown parameter ' ... 
- UML中的六种关系
			设计模式是一种对于面向对象语言(C#,C++,Java)的高级应用.其思维体现出的是真正的代码设计.每一种模式都堪称巧妙!但基于各种设计模式,这里少不了基本的类图设计,本文简要列出6种关系,及相关的例 ... 
- 编写一个javscript函数 fn,该函数有一个参数 n(数字类型),其返回值是一个数组,该数组内是 n 个随机且不重复的整数,且整数取值范围是 [2, 32]。
			function fn(n){ if(n<2 || n>32) { return; } if(!n) { return;} //判断n是否为数字 if(!/^[0-9]+.?[0-9 ... 
- PostgreSQL时间段查询
			1.今日 select * from "表名" where to_date("时间字段"::text,'yyyy-mm-dd')=current_date 2. ... 
- 常用API3 BigData
			基本类型包装类 大家回想下,在第二天我们学习Java中的基本数据类型时,说Java中有8种基本的数据类型,可是这些数据是基本数据,想对其进行复杂操作,变的很难.怎么办呢 基本类型包装类概述 在实际程序 ... 
- contaner
			what Container技术是直接将一个应用程序所需的相关程序代码.函式库.环境配置文件都打包起来建立沙盒执行环境 history 早在1982年,Unix系统内建的chroot机制也是一种Con ... 
- JPA学习-03
			一.单向一对多 特点:性能差,不怎么用,有集合默认懒加载 @OneToMany 1.private Set<T> t = new HashSet<>() 2.private L ... 
- Codeforces 873 简要题解
			文章目录 A题 B题 C题 D题 E题 F题 传送门 A题 传送门 题意: 一个人要做nnn件事,时间花费分别为a1,a2,...,an,a1≤a2≤a3≤...≤ana_1,a_2,...,a_n, ... 
- git遇到的问题-- Another git process seems to be running in this repository
			执行git add .时,报错 fatal: Unable to create '/Users/lily/ForWork/forReBaomai/bm-fe/.git/index.lock': Fil ... 
