jQuery图片预览插件,支持拖拽、缩放(原创)

所属分类:媒体-幻灯片和轮播图,图片展示

 25803  212  查看评论 (10)
分享到微信朋友圈
X
jQuery图片预览插件,支持拖拽、缩放(原创) ie兼容9

更新时间:2019-11-27 23:48:11

插件说明

1、支持图片预览,拖拽位置,放大缩小,上一张下一张功能
2、文件仅需引入一个js。 demo中因演示需要引入了img和html
3、使用方式仅一行代码

ImagePreview.init({id:"imgs"});

4、传参模式一:所有img的父级元素id(不支持跨级,跨级请用第二种)
传参模式二:用jq选择到要初始化的img元素也可以

相关插件-幻灯片和轮播图,图片展示

Jquery轮播图

简洁大气轮播图插件,可控制点击切换或者移至切换。代码逻辑清晰,便于学习。授人以鱼不如授人以渔。
  幻灯片和轮播图
 42731  347

仿英雄杀游戏官网幻灯片JS代码

仿英雄杀游戏官网幻灯片JS代码
  幻灯片和轮播图
 36581  431

jQuery百叶窗轮播插件Shutter

兼容至IE8的自适应百叶窗轮播,切换效果多样。
  幻灯片和轮播图
 40744  405

jQuery响应式全屏轮播插件royalslider.js

全屏轮播插件可放大缩小,支持触控,移动端使用,本插件为收费插件,特意整理出来的
  幻灯片和轮播图
 48497  373

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

    Jessica 0
    2021/9/26 11:23:18
    我修改了样式就无法手指捏合放大了😫 回复
    Pull You Socks Up 0
    2021/3/14 14:38:54
    为什么click事件会触发两次啊 回复
    大富翁 0
    2021/1/6 16:52:01
    哎哎,是我自己不小心加了个> 找到了 回复
    大富翁 0
    2021/1/6 16:34:05
    请问作者,或者哪位朋友 我引用了imagePreview.min.js 会在界面上多出一个 > 我感觉是引用的js造成的,这个怎么解决 回复
    彭宏丁 0
    2020/12/19 11:32:24
    好像最多处理10张图片 多了就不会显示
        彭宏丁0
        2020/12/19 11:40:15
        找到原因了 是作者写的时候往前往后都是按两页跳的
        彭宏丁0
        2020/12/19 12:01:19
        找到真正原因了 应该是cilck多次触发 误会作者了
    回复
    jwq18734130053 1
    2020/5/9 23:46:24
    当整个网页通过鼠标滚轮滚动时,然后再拖拽图片,图片的位置会跑丢,我调试时应为obj.offset().top会随着滚轮滚动而变化。
    我修改了源码,先计算图片自身的位置,然后再计算鼠标移动的位移,最后在原来图片的位置之上加等于鼠标移动的距离。
        一个大写的萌比0
        2020/5/11 17:35:49
        谢谢,希望这个回复能够帮助到其它小伙伴。
        当时写的时候没有在滚动页面下测试过,这个点忽略了,确实有这个问题。
        得唠?0
        2022/1/3 20:56:35
        大侠能把修改后的源码发布一下供学习一下吗?👍
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复