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

  1. <div class="maxpSlid" style="position: relative;">
  2. <div class="maxpSlid-content" style="position: absolute; width: 540px;">
  3. <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>
  4. <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>
  5. <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>
  6. </div>
  7. <div class="maxpSlid-triggers">
  8. <em class="active"></em>
  9. <em class=""></em>
  10. <em class=""></em>
  11. </div>
  12. </div>

  

  1. <script>
  2. var maxpSlid = $$('.maxpSlid');
  3. maxpSlid.each(function(item){
  4. new Switchable(item, {
  5. effect: 'scrollx',
  6. hasTriggers: true,
  7. duration:0,
  8. interval:4000,
  9. panels: 'a',
  10. triggers: 'em',
  11. steps: 1,
  12. haslrbtn: true,
  13. autoplay: true,
  14. viewSize:[310,550]
  15. })
  16. })
  17. </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. Factorial Solved Problem code: FCTRL

    import sys #import psyco #很奇怪,这题用psyco就runtime error #psyco.full() def z(n): #这个应该是技巧的一种算法 r = 0 whi ...

  2. mysql日志文件相关的配置【2】

    1.二进制日志是什么? mysql 的二进制日志用于记录数据库上做的变更. 2.二进制日志什么时间写到磁盘 1.总的来说二进制日志会在释放锁之前就写入磁盘.也就是说在commit完成之前:client ...

  3. 需要熟悉的几个调试命令:objdump/pmap/ldd/stace

    最近要编译很多库,还涉及到若干进程操作,所以就把相关的命令记录下来. 一,objdump命令 该命令适用于ELF可执行文件,常用的命令如下: objdump -h xx.o : 输出ELF文件的各个段 ...

  4. Unity3D中C#编写脚本

    1.继承MonoBehaviour类:任何一个游戏脚本都需要去继承MonoBehaviour这个类,只是在创建javascript脚本的时候,系统会将其类名与继承关系隐藏起来. 2.声明变量:使用Ja ...

  5. android 无法生成R文件的原因剖析

    android 无法生成R文件 是件痛苦的事情,即使有时候你xml文件没有错误,他都无法生成.针对此问题,我总结以下几个方面的原因. 一.xml本身有错误 R.java这个文件是会自动生成的,但是如果 ...

  6. 2015第24周三Spring事务3

    在一个典型的事务处理场景中,有以下几个参与者: Resource Manager(RM) ResourceManager简称RM,它负责存储并管理系统数据资源的状态,比如数据库服务器,JMS消息服务器 ...

  7. Java并发实现一(并发的实现之Thread和Runnable的区别)

    package com.subject01; public class ThreadOrRunnable { public static void main(String[] args) { Syst ...

  8. struts1配置文件之input

    <action path="/*Person" type="cn.itcast.PersonAction" scope="request&quo ...

  9. Linux RAR 安装和使用详细说明

    描述:Linux默认自带ZIP压缩,最大支持4GB压缩,RAR的压缩比大于4GB.  流程:下载 >安装 > 使用  ----------------------------------- ...

  10. 【技术文档】《算法设计与分析导论》R.C.T.Lee等·第7章 动态规划

    由于种种原因(看这一章间隔的时间太长,弄不清动态规划.分治.递归是什么关系),导致这章内容看了三遍才基本看懂动态规划是什么.动态规划适合解决可分阶段的组合优化问题,但它又不同于贪心算法,动态规划所解决 ...