jQuery支持图片放大缩小查看效果

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

180355 563 查看评论 (115)

分享到微信朋友圈

查看演示立即下载

插件描述：e-smart-zoom-jquery.js插件页面上提供了两个按钮，可以让你的图片点击放大或者缩小当然，对于懒人来说，真是懒得点击那么你可以将鼠标悬停在图片上，滚动鼠标滚轮即可实现图片的放大或者缩小效果

效果描述：

e-smart-zoom-jquery.js插件

页面上提供了两个按钮，可以让你的图片点击放大或者缩小

那么你可以将鼠标悬停在图片上，滚动鼠标滚轮即可实现图片的放大或者缩小效果

使用方法：

1、将head中的css样式引入到你的网页中

2、将代码部分拷贝到你的网页body结束前的地方即可

jQuery触摸手机全屏上下滑动滚屏特效

垂直四级导航

jQuery蜂窝相框（HexagonBg.js）

jQuery六边形相框自动生成

图片展示

23017 303

jQuery动态缩放焦点图

图片展示

34501 401

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

此插件功能包括手机轮播，图片点击放大再次点击缩小功能

图片展示

100889 398

jQuery圆形转动切换文字

jQuery实现头像和文字的切换，并且伴随着圆环的转动，很有趣的效果

图片展示

32517 514

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

爱吐泡泡的螃蟹 0

2021/7/21 20:09:37

西瓜0

2021/7/21 23:17:52

var scaleToAdd = 0.8;每次点击加号增加的倍数。😉

爱吐泡泡的螃蟹0

2021/7/22 10:05:08

看到了, 感谢大佬, 那那个鼠标滚动放大的在哪控制的啊

你?留的?度、夏天也?冷 0

2021/6/16 17:18:40

李伟利0

2022/9/8 11:47:32

同问，这个拖动的时候会闪屏以及图片会失真

书呆子 0

2019/6/20 17:50:46

文1

2021/7/31 11:05:10

var rotatenum = 0;
$(window).load(function() {
    $(".phototool button").click(function() {
        var index = Number($(this).index());
        switch (index) {
            case 0:
                rotatenum = rotatenum + 90;
                break;
            case 1:
                rotatenum = rotatenum - 90;
                break;
        }
        if (index == 0 || index == 1) {
            $("#imgcontent img").css({
                '-webkit-transform': 'rotate(' + rotatenum + 'deg)',
                '-ms-transform': 'rotate(' + rotatenum + 'deg)',
                '-moz-transform': 'rotate(' + rotatenum + 'deg)',
                '-o-transform': 'rotate(' + rotatenum + 'deg)',
                'transform': 'rotate(' + rotatenum + 'deg)'
            });
        }
    });
});