左右图片循环滚动停顿一下后继续
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的公告无限循环滚动实现代码
在线演示: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.
-
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的内容循环滚动小模块(仿新浪微博未登录首页滚动微博显示)
从需求上来说,这个功能需要实时调用最新的微博数据,单就前端开发来说,其需求可以拆分如下: 1 内容持续滚动: 2 新微博将下面的微博先推下去,然后淡入进来: 3 鼠标经过内容暂停滚动: 4 容器底部渐变消失在背景色下. 上述4个需求之中,需求1-3为js技术实现,需求4为css技术实现,下面逐个需求来讲. 需求1和需求2:内容持续滚动的需求有些类似前一篇文章<小模块:公告滚动并暂停>中介绍的功能,在那篇文章中,此功能使用css的position定位来控制整个ul列表的移动动画.结合需求2,我们
-
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
-
左右图片循环滚动停顿一下后继续
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
随机推荐
- 详解angularjs 关于ui-router分层使用
- 星外科技每天自动备份SQL2000/Mysql的工具
- 使用Jmail及Winwebmail发信时系统记录中的错误:502 Error: command ...
- iOS延迟执行方法详解
- php获取参数的几种方法总结
- python文件操作之目录遍历实例分析
- 详解Docker中VLAN网络模式的配置
- javascript去掉代码里面的注释
- 安装Python的教程-Windows
- Js 本页面传值实现代码
- ASP.NET基于Ajax的Enter键提交问题分析
- 微信小程序 蓝牙的实现实例代码
- Vee-Validate的使用方法详解
- 双缓冲技术实现Android 画板应用
- 文件夹runauto..的删除方法 附批处理专杀工具
- Android编程实现ListView内容无限循环显示的方法
- C++实现ping程序实例
- C# 设计模式系列教程-状态模式
- Vue 换肤的示例实践
- python2.7 json 转换日期的处理的示例