jQuery放大镜插件imgzoom.js

所属分类:媒体-图片展示

 27615  317  查看评论 (7)
分享到微信朋友圈
X
jQuery放大镜插件imgzoom.js ie兼容8

imgzoom是一款基于jQuery的图片方法插件。

使用方法:

1.引入jQuery与imgzoom,imgzoom.css

<link rel="stylesheet" href="css/jquery.imgzoom.css" />
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script type="text/javascript" src="js/jquery.imgzoom.min.js" ></script>

2.调用插件

$(".main").imgzoom({position:"inner"});

参数说明:

1. position:放大图片显示的位置,包括‘inner’,'top','left','right','bottom'。

2. boxWidth:图片锁定区域框的宽度。

3. boxHeight:图片锁定区域框的高度。

4. borderRadius:图片锁定区域框的圆角弧度

5. left:当图片位置不为inner时候,left有效

6. top:当图片位置不为inner的时候,left有效

相关插件-图片展示

移动端图片缩放插件Pinchzoom.js

此插件功能包括手机轮播,图片点击放大再次点击缩小功能
  图片展示
 100642  398

图片点击放大并居中显示

纯js实现的一个图片点击放大并居中显示的插件,支持自定义图片详情,可作为图片浏览插件,也可自行改写
  图片展示
 53223  356

jQuery图片放大镜

实现如京东等网站放大缩小效果
  图片展示
 27139  317

简易的jQuery无缝滚动(原创)

简易无缝滚动,只需要改变高度(不用设宽度)嗯,或许看看就知道是不是你想要的
  图片展示
 37458  441

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

    guozhichao 0
    2019/3/26 17:44:04
    在项目中引用之后 一直报错 $(".main").imgzoom({position:"inner"}); imgzoom不是函数
        西瓜0
        2019/3/26 17:58:42

        这个应该是个低级问题,先调用jQuery库在调用jquery.imgzoom.min.js,你应该是顺序错误引起的。

        <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
        <script type="text/javascript" src="js/jquery.imgzoom.min.js" ></script>
        geguangzhao0
        2020/4/13 10:00:45
        应该是的。还有不少优化的地方哈
    回复
    guozhichao 0
    2019/3/26 17:42:34
    jquery.imgzoom.min.js 大佬 有没有不带min的js文件呀
        西瓜0
        2019/3/26 17:54:53

        用js格式式工具自己格式一下就行了

        https://www.jq22.com/jsgsh
        geguangzhao0
        2020/4/13 10:01:13
        嗯嗯,可以格式化的。这个是只是普通压缩
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复