jQuery放大镜插件imgzoom.js

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

 27917  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有效

相关插件-图片展示

14种炫酷堆叠卡片切换动画特效

14种炫酷堆叠卡片切换动画特效
  图片展示
 49417  515

鼠标划过图片放大效果

一般用于展示类,鼠标滑过,图片放大,焦点图
  图片展示
 48809  480

jQuery模仿PPTCSS3介绍

jQuery模仿PPTCSS3介绍,使用鼠标滚轮进行切换
  图片展示
 27860  368

焦点效果

类似于百叶窗的效果
  图片展示
 35155  362

讨论这个项目(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
        嗯嗯,可以格式化的。这个是只是普通压缩
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复