jQuery文字闪烁效果插件

来源:https://www.sucaihuo.com/js/2723.html 2017-08-13 23:48浏览(823) 收藏

一款jQuery文字闪烁效果插件,可以通过按钮分别控制不同文字的闪烁,可以用于页面的一些消息提示,闪烁能吸引用户的注意,喜欢的童鞋请收下吧。
jQuery文字闪烁效果插件
分类:文字特效 > 文字动画 难易:初级
查看演示 下载资源 下载积分: 20 积分
关注公众号,免费赠送安装视频教程、环境和学习视频,后面会不断更新。

页面的head部分,需引入页面的样式文件,代码如下:

<link rel="stylesheet" type="text/css" href="css/style.css">

页面的body部分,h3标签放置需要加入闪烁动画的文字,div容器里面放入两个控制闪烁动画的按钮,代码如下:

<h3 style="text-align: center;"> 这 是 <span class="blink"> 一 段 </span > 文 字 <span class="blink blink2">闪 烁 效 果</span> 演 示!</h3>
<div class="center">
	<input type="button" value="停止闪烁" id="stop" />
	<input type="button" value="停止第二个闪烁" id="stop2" />
</div>

页面的底部,需引入jQuery库和文字闪烁插件,并启用插件设置好点击事件的响应,代码如下:

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.blink.js"></script>
<script type="text/javascript">
$(document).ready(function() {
        $('.blink').blink({
            delay: 500
        });
        $('#stop').click(function() {
            $('.blink').unblink();
        });
        $('#stop2').click(function() {
            $('.blink2').unblink();
        });
    });
</script>
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2