http://www.16sucai.com/uploadfile/show5/switchable01/switchable/

<div class="maxpSlid" style="position: relative;">
<div class="maxpSlid-content" style="position: absolute; width: 540px;">
<a href="/product-2766.html" title="康佳" style="float: left;"><img src="http://www.taifengmall.com/public/images/21/12/60/91c5ddcc14a16355b21d85dc5ac1e989.jpg?1450173334#h" alt="康佳" width="180" height="420"></a>
<a href="/product-4758.html" title="海信" style="float: left;"><img src="http://www.taifengmall.com/public/images/10/39/e9/0686ab1a02fc11bbef43d9ccd7dd1fe6.jpg?1450173362#h" alt="海信" width="180" height="420"></a>
<a href="/product-4933.html" title="三星" style="float: left;"><img src="http://www.taifengmall.com/public/images/ed/4e/cc/32f9894ff51caf6b03b428f32e7e2fa9.jpg?1450173384#h" alt="三星" width="180" height="420"></a>
</div>
<div class="maxpSlid-triggers">
<em class="active"></em>
<em class=""></em>
<em class=""></em>
</div>
</div>

  

<script>
var maxpSlid = $$('.maxpSlid');
maxpSlid.each(function(item){
new Switchable(item, {
effect: 'scrollx',
hasTriggers: true,
duration:0,
interval:4000,
panels: 'a',
triggers: 'em',
steps: 1,
haslrbtn: true,
autoplay: true,
viewSize:[310,550]
})
})
</script>

图片自动转换效果 jquery的更多相关文章

  1. js实现图片自动切换效果。

    js实现图片自动切换效果,简单实用,原谅我只是一只小菜鸟还在学大神天天写博文装逼. <script language="javascript"> setInterval ...

  2. Axure 图片轮播(广告通栏图片自动播放效果)

    baiduYunpan:http://pan.baidu.com/s/1eRPCy90 里面的“图片轮播”部件即可实现这个功能

  3. jQuery个性化图片轮播效果

    jQuery个性化图片轮播效果 购物产品展示:图片轮播器<效果如下所示> 思路说明: 每隔一段时间,实现图片的自动切换及选项卡选中效果,鼠标划入图片动画停止,划出或离开动画开始 两个区域: ...

  4. jquery 图片自动无缝滚动

    <!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-e ...

  5. jQuery图片自动添加水印插件

    JS脚本(jQuery)为图片加水印效果预览:http://hovertree.com/texiao/jquery/94/ 本功能使用HTML5实现,可为图片加上文字水印,可设置文字,设置颜色,位置等 ...

  6. JQuery图片切换动画效果

    由于博主我懒,所以页面画的比较粗糙,但是没关系,因为我主要讲的是如何实现图片动画切换. 思路:想必大家都逛过淘宝或者其他的一些网站,一般都会有图片动画切换的效果,那是怎样实现的呢?博主我呢,技术不是很 ...

  7. jQuery演示10种不同的切换图片列表动画效果

    经常用到的图片插件演示jQuery十种不同的切换图片列表动画效果 在线演示 下载地址 实例代码 <!DOCTYPE html> <html lang="en" c ...

  8. jQuery演示10种不同的切换图片列表动画效果以及tab动画演示 2

    很常用的一款特效纯CSS完成tab实现5种不同切换对应内容效果 实例预览 下载地址 实例代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 ...

  9. JS可控制的图片自动循环播放查看效果

    JS可控制的图片自动循环播放查看效果 <html> <head> <title>JS可控制的图片自动循环播放查看效果丨芯晴网页特效丨CsrCode.Cn</t ...

随机推荐

  1. SQL建模错误--逗号分隔值

    最近帮一个客户分析SQL语句的问题,大致经过如下 场景: 委托方有一个用于追踪他们产品的系统,每个产品都会卖给许多客户:但是客户又被从业务上分成两类,一类是带有合作伙伴性质的,这个 合作伙伴通常会给予 ...

  2. Log4j MDC Tomcat下报异常org.apache.log4j.helpers.ThreadLocalMap

    严重: The web application [/qdgswx] created a ThreadLocal with key of type [org.apache.log4j.helpers.T ...

  3. Android中写入读取XML

    获取XML文件的基本思路是,通过getResources().getXml()获的XML原始文件,得到XmlResourceParser对象,通过该对象来判断是文档的开头还是结尾,是某个标签的开始还是 ...

  4. android获取屏幕宽高与获取控件宽高

    获取屏幕宽高 // 获取屏幕宽高(方法1) int screenWidth = getWindowManager().getDefaultDisplay().getWidth(); // 屏幕宽(像素 ...

  5. IT人大学生活之“做点正经事”

    最近一直主抓部门的人事招聘工作:很多到手的简历,特别是毕业一年之内的同学的简历上面都会写到:在xxx餐饮公司实习,获得了与人交流的经验:在学生会组织了哪些文体活动:在大四参加了一些与软件开发不相关的一 ...

  6. bzoj3174 [Tjoi2013]拯救小矮人

    Description 一群小矮人掉进了一个很深的陷阱里,由于太矮爬不上来,于是他们决定搭一个人梯.即:一个小矮人站在另一小矮人的 肩膀上,知道最顶端的小矮人伸直胳膊可以碰到陷阱口.对于每一个小矮人, ...

  7. HTML--鼠标事件

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  8. Collections.sort()

    Comparator是个接口,可重写compare()及equals()这两个方法,用于比价功能:如果是null的话,就是使用元素的默认顺序,如a,b,c,d,e,f,g,就是a,b,c,d,e,f, ...

  9. std::remove_if

    原型: #include <algorithm>forward_iterator remove_if( forward_iterator start, forward_iterator e ...

  10. Android 关于倒计时功能的实现

    关于倒计时的实现,可以说有很多的方法,比较常见的就是Timer+TimerTask+Handler了,或者还可以配合Runnable.例如下面的代码: import java.util.Timer; ...