javascript 跑马灯
1.看了写跑马灯的教程案例,隔了段时间自己写了一个简单的跑马灯。将过程中遇到的问题特此记录下来
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<title>简 陋 的 管 理 后 台 </title>
</head>
<body>
<input type='button' value='stop TitleLoop' id='stoploop'/> <script src='C:\Users\wujy1\Desktop\html\js\jquery-3.1.1.min.js'></script>
<script> function TitleLoop(){ //实现标题循环
var Title=$('title').text();
FirstWord=Title[]; //保存字符串第一个字符
Title=Title.substring(); //将字符串第一个字符截取掉
/*
document.title=Title+FirstWord; 使用该方法比较占用内存。例如:
var lang = "Java";
lang = lang + "Script";
首先创建一个能容纳10个字符的新字符串,然后在这个字符串
中填充“Java”和“Script”,最后一步是销毁原来的字符串“Java”
和“Script”,因为这两个字符串已经没用了。但是在低版本的浏
览器(如IE6)中,字符串拼接速度是很消耗一个性能的过程。
*/
var arry=Array(Title,FirstWord); //将新字符串和第一个字符定位为数组(要注意顺序),使用join方法拼接起来
Title=arry.join("");
$('title').text(Title); //更改title内容
} var loop=setInterval("TitleLoop()",); //启用循环
$('#stoploop').click(function(){clearInterval(loop);}); //结束循环 </script>
</body>
</html>
问题:
当我要结束循环,使用以下代码并不可以结束进程:
$('#stoploop').click(function(){clearInterval(setInterval("TitleLoop()",500));})
查看clearInterval说明:clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。
这时候使用:
var loop=setInterval("TitleLoop()",500);
console.log(loop); #返回1
console.log(setInterval("TitleLoop()",500)) #返回2
console.log(setInterval("TitleLoop()",500)) #返回3
所以关闭循环必须将循环赋值给变量,然后关闭掉这个循环。
这时候猜测,每当定义一个 setInterval()时,他的ID值就会加1.验证下:
javascript 跑马灯的更多相关文章
- JavaScript “跑马灯”抽奖活动代码解析与优化(二)
既然是要编写插件.那么叫做"插件"的东西肯定是具有的某些特征能够满足我们平时开发的需求或者是提高我们的开发效率.那么叫做插件的东西应该具有哪些基本特征呢?让我们来总结一下: 1.J ...
- JavaScript “跑马灯”抽奖活动代码解析与优化(一)
最近的项目中做了一个"跑马灯"的抽奖特效插件.上篇文章已经分享过html和css 的相关知识.这篇文章主要分享一些 JavaScript 相关的知识.这几天在写这篇文章的时候,也顺 ...
- javascript跑马灯抽奖
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- javascript小记五则:用JS写一个图片左右自由滚动的“跑马灯”效果
之前看了很多百度搜索出的东西,十个有九个是不能实用的,个个讲的都不详细,今天详细给大家讲解下关于这个图片“跑马灯”滚动效果,源码如下: <!DOCTYPE html PUBLIC "- ...
- JavaScript小实例-文字跑马灯效果
我们常常能看到显示屏上字体的滚动以及手机弹幕等,下面所示代码就是一个简易的文字跑马灯的效果: <!DOCTYPE html> <html> <head lang=&quo ...
- javascript之网页跑马灯
---恢复内容开始--- <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...
- JavaScript实现文字跑马灯
其实实现文字的跑马灯和实现图片轮播的原理是一样的. 下面是我自己实现的,文字的位置可以随便更改,效果不会变,文字的内容可以通过ajax获取,同时,可以直接用Jquery改写一下,很方便. <!D ...
- jq跑马灯效果
这几天公司产品有个无缝循环滚动的广告跑马灯要做,最开始想到的是<marquee>标签,但在PC端正常,在安卓广告屏上却怎么都跑不动,后来用的css3的animation,结果也是PC端及其 ...
- jQuery+CSS3文字跑马灯特效
jQuery+CSS3文字跑马灯特效是一款将跑马灯背景制作为3D立方体效果,文字在上面移动时,就像是文字投影到墙壁上,在转角出会改变运动方向. 效果展示 http://hovertree.com/te ...
随机推荐
- 写了一个Hy的vscode语法高亮插件
-------2018 8 3----------- 把函数名和参数改了,正则有点古怪,参考自带的lambda表达式才搞定 但彩色括号走了弯路,各种配图有彩色括号的插件其实很少是自己搞的,其实只要再装 ...
- VIM编辑器和VI编辑器的区别
vi 和vim 的区别 写在前面:这个两个"东西"着实让我烦恼一阵子,但是自己一直没当回事,但是遇到了好几次再决定彻底把他们搞的明白,一下是我通过查找资料了解到的关于这两个编辑器的 ...
- ThinkPHP执行原生的SQL语句
执行原生的SQL语句: $sql="insert select update delete...."; ①查询语句: $model对象 -> query($sql); ...
- 关于在使用sparksql写程序是报错以及解决方案:org.apache.spark.sql.AnalysisException: Duplicate column(s): "name" found, cannot save to file.
说明: spark --version : 2.2.0 我有两个json文件,分别是emp和dept: emp内容如下: {"name": "zhangsan" ...
- OPSF - 2,状态机
1,报文更新地址 点到点:所有报文发送224.0.0.5 虚链路:单播地址 广播网络上:DR OTHER至DR/BDR 224.0.0.6,DR/BDR至DR OTEHER 2 ...
- linux进程管理之作业控制
作业控制 jobs ==================================================================================== 作业控制是 ...
- linux中用composer安装yii框架
我的服务器是安装的是lanmp环境 如果环境版本比较低的话,建议升级一下版本 升级版本命令:./lanmp.sh cus 全都选择最高的.完成之后: curl -sS https://getcompo ...
- 求[1,n]中与m互素的个数
void dfs(int d, ll num, int z) { if (d>cnt) { if (num!=1) ans+=z*n/num; } else { dfs(d+1,num*p[d] ...
- 『计算机视觉』Mask-RCNN
一.Mask-RCNN流程 Mask R-CNN是一个实例分割(Instance segmentation)算法,通过增加不同的分支,可以完成目标分类.目标检测.语义分割.实例分割.人体姿势识别等多种 ...
- 『MXNet』第八弹_数据处理API_下_Image IO专题
想学习MXNet的同学建议看一看这位博主的博客,受益良多. 在本节中,我们将学习如何在MXNet中预处理和加载图像数据. 在MXNet中加载图像数据有4种方式. 使用 mx.image.imdecod ...