jQuery 第8章 hcZoom-图片缩放插件、图片放大镜特效 jQuery 第8章 hcZoom-图片缩放插件、图片放大镜特效

2022-07-18

1、介绍

HcZoom 是一款免费的、开源的图片缩放jQuery插件。具有以下特点:

  • 使用简单,只需简单的2行代码即可完成特效的编写。

  • 兼容 ie (6 及以上版本)、火狐、谷歌等各类浏览器。ietester 下i6有透明bug,在真实ie浏览器中无问题!

  • 核心属性可以通过hc_zoom 属性进行配置,方便、灵活。

2、演示(点击)

https://file.lulublog.cn/images/3/2022/08/cde34mEmSmsEKI4hlRIiEEhARMmMd4.jpg

3、代码(点击)

4、hc_zoom属性设置规则

您可以通过设置大图的 hc_zoom 属性来设置缩放效果的相关属性,语法  
注意取值需要用单引号引起来!!! 属性名称、作用、取值示例或范围介绍: 

position : 设置大图的展示位置,默认右侧展示,可以设置为 'left', 'right'。
margin : 设置大图的展示位置距小图的间距,可以设置为一个数字。
border : 放大镜的边框设置,可以设置的值: '5px solid #888888',一个完整的边框样式。
bg_color : 遮罩背景的颜色,默认 '#FFFFFF',可以设置成一个颜色编码 '#.....'。
opacity : 遮罩背景的透明度,默认 0.3,可以设置为 0.1 ~ 1 直接的数值。
large_border : 设置大图的边框,可以设置的值: '5px solid #888888',一个完整的边框样式。
auto_change : 是否开启鼠标滑轮滚动 默认 true,可设置的值 true false


打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开微信扫一扫,即可进行扫码打赏哦

阅读 606