jQuery手风琴轮播图

所属分类:导航,媒体-手风琴菜单,图片展示,幻灯片和轮播图

 48106  580  查看评论 (34)
分享到微信朋友圈
X
jQuery手风琴轮播图 ie兼容9

实现非常简单,监听鼠标事件,当鼠标移动到元素上给该元素添加一个class,通过class改变来实现轮播效果

相关插件-手风琴菜单,图片展示,幻灯片和轮播图

jQuery手风琴动画效果

鼠标点击图片手风琴展开特效
  手风琴菜单
 36215  344

折叠面板

这是一个轻量级的折叠面板插件,可用在二级菜单、多条目内容块等地方,使用也很方便。有三个参数可以自行设置展开时间等等
  手风琴菜单
 38582  262

简洁实用的jQuery手风琴插件

jquery.accdion是一款非常实用的jQuery手风琴插件。它代码简单,文件体积小,并且兼容IE8浏览器。它通过简单的设置即可以得到漂亮的手风琴图片切换效果。
  手风琴菜单
 28106  286

jquery手风琴折叠式

多级菜单 JS 手风琴
  手风琴菜单
 32811  278

讨论这个项目(34)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    mahayu2011 0
    2020/10/12 15:27:04
    高度能自适应吗 回复
    levan 0
    2019/7/6 11:46:54
      0
    2019/7/1 16:11:26
    太感谢!!!2B赛高! 回复
    简简单单 0
    2019/4/22 22:36:42
    跟a标签一样用href实现 回复
    ??Freak?? 0
    2018/12/17 22:02:06
    怎么给每张图片都设置超链接,我发现这个只能链接到一个页面上 回复
    攫月Scarlet 0
    2018/8/28 17:58:23
    冷色调的夏天 0
    2018/5/18 1:15:22
    怎么加更多的图片
        泡??斌メ1
        2018/5/23 15:48:34

        对应的背景<div class="bg bg-box-1"></div>先添加一个,手风琴项也对应加一个

        <li>
            <div class="text">
                尼尔机械纪元
            </div>
        </li>

        还有css样式自己加一下
        另外加图片需要进行宽带计算,当前总宽是1000px,显示的图片为700px,隐藏的图片为100px,所以当前4张图片3个隐藏总共300px,加上一个显示为700px,加起来刚好是1000px,若要加图片的话就必须缩小图片显示的宽度。
        比如加一张图,由于隐藏图片占宽是100px,所以显示宽必须要减少100px

        0
        2019/3/27 17:58:35
        使用A标签包住各个图片 如:<a href="#">图片</a> #是你要链接到的地址!
    回复
    龙猫 0
    2018/1/4 17:34:54

    如果有问题直接回复我

        龙猫0
        2018/1/4 17:48:49

        “如果有问题直接回复我”这句话本是想用在代码放得上来的情况下的。。。然而现在。。大家不要介意

        ??Freak??0
        2018/12/17 22:04:33
        请问怎么给每张图片都设置不同的超链接,为什么四个图片只能链接到一个页面,点哪个都是到同一个页面
        鱼龙灬岛主0
        2018/12/20 14:25:40
        用a标签包住图片,然后每个写上不通过的链接地址。
        生而平凡0
        2019/1/11 11:06:15
        使用A标签包住各个图片 如:<a href="#">图片</a> #是你要链接到的地址!
        留念0
        2019/1/14 9:28:20
        四张如果要链接到一个地址,就用一个<a href="#">图片</a>包住,要是想链接到不同地址就只包一个图片
        admin0
        2019/1/29 14:06:29
        他的图片写在CSS这怎么包
        Woow0
        2019/2/12 16:25:14
        图片如果写的css,就去掉,写到html里。用a标签包住img,然后herf上写上链接地址。
        raychu11240
        2020/4/23 15:22:42
        每个图片用不同的a标签包裹
    回复
    T。 0
    2017/12/12 22:37:01

    怎么增加更多的图片

        泡??斌メ0
        2018/5/23 15:49:05
        看楼上的回复
    回复
    青墨 0
    2017/12/12 17:52:35
    觉得还不错,虽然还没看代码。好评先 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复