左右图片循环滚动停顿一下后继续
var oState = 'oImg1';
function filterImg(){
oDiv.filters[0].Apply();
switch(oState){
case 'oImg1' :
oState = 'oImg2';
self['oImg1'].style.visibility = 'visible';
self['oImg2'].style.visibility = 'hidden';
self['oImg3'].style.visibility = 'hidden';
break;
case 'oImg2' :
oState = 'oImg3';
self['oImg1'].style.visibility = 'hidden';
self['oImg2'].style.visibility = 'visible';
self['oImg3'].style.visibility = 'hidden';
break;
case 'oImg3' :
oState = 'oImg1';
self['oImg1'].style.visibility = 'hidden';
self['oImg2'].style.visibility = 'hidden';
self['oImg3'].style.visibility = 'visible';
break;
default :
break;
}
oDiv.filters[0].Play();
setTimeout('filterImg()',1500);
}
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相关推荐
-
JQuery循环滚动图片代码
复制代码 代码如下: function refresh() { var s = $(".box1"); if (!s.is(":animated")) $(".box1").animate({ marginLeft: "0px" }, "slow", function () { $('.box1 img:first').before($('.box1 img:last')); $(".box1&q
-
基于jquery的内容循环滚动小模块(仿新浪微博未登录首页滚动微博显示)
从需求上来说,这个功能需要实时调用最新的微博数据,单就前端开发来说,其需求可以拆分如下: 1 内容持续滚动: 2 新微博将下面的微博先推下去,然后淡入进来: 3 鼠标经过内容暂停滚动: 4 容器底部渐变消失在背景色下. 上述4个需求之中,需求1-3为js技术实现,需求4为css技术实现,下面逐个需求来讲. 需求1和需求2:内容持续滚动的需求有些类似前一篇文章<小模块:公告滚动并暂停>中介绍的功能,在那篇文章中,此功能使用css的position定位来控制整个ul列表的移动动画.结合需求2,我们
-
jQuery循环滚动展示代码 可应用到文字和图片上
看见有的同学用 Adam Cai 的代码,感觉稍显复杂而且不够 jQuery.我用只依靠 jQuery 入门的思路写了一版,代码更少使用也更简单. 在线演示: http://demo.jb51.net/js/2012/jquery_xhpic/[JavaScript]代码 复制代码 代码如下: $(document).ready(function(){ $("#sItem li:not(:first)").css("display","none"
-
基于jQuery的公告无限循环滚动实现代码
在线演示:http://demo.jb51.net/js/2012/callboard/jQuery代码 复制代码 代码如下: //第二版:Newton改造 (function (win){ var callboarTimer; var callboard = $('#callboard'); var callboardUl = callboard.find('ul'); var callboardLi = callboard.find('li'); var liLen = callboard.
-
左右图片循环滚动停顿一下后继续
var oState = 'oImg1'; function filterImg(){ oDiv.filters[0].Apply(); switch(oState){ case 'oImg1' : oState = 'oImg2'; self['oImg1'].style.visibility = 'visible'; self['oImg2'].style.visibility = 'hidden'; self['oImg3'].style.visibility = 'hidden'; br
-
JavaScript代码实现图片循环滚动效果
1.概述 循环滚动图片,不仅可以增添Web页面的动态效果,而且可以节省页面空间,有效地保证在有限的页面中显示更多的图片. 2.技术要点 主要应用setTimeout()方法实现图片的循环滚动效果.setTimeout()方法的语法格式如下: setTimeout(function,milliseconds,[arguments]) 参数说明: a. function:要调用的JavaScript自定义函数名称. b. Milliseconds:设置超时时间(以毫秒为单位). 功能:经过超时时间后
-
jQuery实现一组图片循环滚动
本文实例为大家分享了jQuery实现一组图片循环滚动的具体代码,供大家参考,具体内容如下 效果: 代码: <!DOCTYPE html> <html lang="ch"> <head> <meta charset="UTF-8"> <title>实现一组图片的循环滚动</title> <style type="text/cs
-
Unity3d实现无限循环滚动背景
在游戏项目中我们常常看到商城的广告牌,几张广告图片循环滚动,类似跑马灯,现在我将讨论一种实现方法,并提供一个管理类,大家可以直接使用. 实现原理:背景图片循环滚动的原理很简单:两张图片向一个方向移动,当达某张图片到临界区域时将图片放在后面,依次循环. 在实际项目中,广告牌显示的图片数量不确定,例如某个假期活动会上很多新品,此时我们需要动态的创建显示的图片(一般在配置表读取数据),如果需要显示分类标签还得动态生成分类标签. 综上所述,一个完整的广告牌组件应该具有以下功能: - 无限循环的滚动背景图
-
JS实用的带停顿的逐行文本循环滚动效果实例
如下所示: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>JS实用的带停顿的逐行文本循环
-
多种JQuery循环滚动文字图片效果代码
自己模仿JQ插件的写法写了一个循环滚动列表插件,支持自定义上.下.左.右四个方向,支持平滑滚动或者间断滚动两种方式,都是通过参数设置.JQ里面有些重复的地方,暂时没想到更好的方法去精简.不过效果还是可以的,如下(效果图上传后都加速了,实际效果比这个要慢很多): html代码如下: <!doctype html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <
-
vue实现循环滚动图片
本文实例为大家分享了vue实现循环滚动图片的具体代码,供大家参考,具体内容如下 效果(循环滚动,可切换方向): 轮播组件BaseSwiper.vue: <template> <div class="swiperBox"> <img class="imgLeft" @click="clickLeft" src="../../../assets/img/左.png" alt=&
-
jQuery实现列表自动循环滚动鼠标悬停时停止滚动
需要在页面中一个小的区域循环滚动展示新闻(公告.活动.图片等等),并且,鼠标悬停时停止滚动并提示,离开后,继续滚动. 效果图: 上干货 html: 复制代码 代码如下: <div id="news"> <ul> <li><a href="#" title="aaaaaaaaaaaaaaa">aaaaaaaaaaaaaaa</a></li> <li><a h
-
jQuery实现列表自动滚动循环滚动展示新闻
需要在页面中一个小的区域循环滚动展示新闻(公告.活动.图片等等),并且,鼠标悬停时停止滚动并提示,离开后,继续滚动. 效果图: 上干货 html: 复制代码 代码如下: <div id="news"> <ul> <li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofol
随机推荐
- JS处理数据四舍五入(tofixed与round的区别详解)
- 浅谈基于SQL Server分页存储过程五种方法及性能比较
- jQuery Ajax方法调用 Asp.Net WebService 的详细实例代码
- 全面介绍javascript实用技巧及单竖杠
- ThinkPHP写第一个模块应用
- Asp.net 文本框全选的实现
- 静态页面html中跳转传值的JS处理技巧
- 非常漂亮的JS代码经典广告
- input之怎么清除默认值
- php中使用parse_url()对网址进行解析的实现代码(parse_url详解)
- 一个强大的网络分析shell脚本分享(实时流量、连接统计)
- SQL语法 分隔符理解小结
- 安装了一流信息监控后会拦截SQL操作的问题
- 面向对象设计模式的核心法则
- PHP读取Excel类文件
- 以太网络建立多个VLAN典型案例
- 车协科技为您提供免费空间服务
- Webpack实战加载SVG的方法
- JS实现简单的浮动碰撞效果示例
- CentOS6.5环境安装nginx服务器及负载均衡配置操作详解