jQuery仿京东商品放大镜

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

 6453  118  查看评论 (25)
jQuery仿京东商品放大镜 ie兼容6

更新时间:5/21/2017, 11:50:10 AM

更新说明:修改了底部缩略图两边的箭头只能点击一次,第二次开始就没反应的问题


原作者地址: 

http://www.jq22.com/jquery-info698

效果和目前JD使用的一模一样哦,仅供学习。。。如有问题,请留言

相关插件-图片展示

css3 3D网格效果

今天我们想与你分享一个小小的动画概念。这个想法是旋转中 3D 网格项、 全屏显示将其展开和透露的一些内容。
  图片展示
 12303  32

jQuery图片放大镜(原创)

使用背景定位制作的一个图片放大镜
  图片展示
 8533  62

jQuery图片内部缩放和平移插件jquery.zoom.js

jquery.zoom.js是一款非常实用的图片内部缩放和平移jQuery插件。该插件可以鼠标滑过图片,点击图片或移动手机上触摸图片时,将图片进行放大或平移操作。
  图片展示
 11995  45

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

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

讨论这个项目(25)回答他人问题或分享插件使用方法奖励jQ币

    ┵?つ 陪我吹吹风 0
    2017/7/31 14:48:10
    cyzxy 0
    2017/7/19 10:42:30

    我想问下右边大图中的JD京东的那个水印是本来大图上就有的还是你代码控制的

        smallhappiness0
        2017/7/19 10:44:47
        你可以看下本地图片啊亲
    回复
    还我门匙^v^ 0
    2017/7/11 11:19:21

    下载使用了,一定要用三张不同尺寸的图片么,

    <div class="big-box">
        <img src="images/big_1.jpg">
    </div>

    不用也可以么?

        smallhappiness0
        2017/7/11 12:27:23

        可以呀,但是小图你非要用大图来做,那么资源加载慢以及大图缩小,貌似会很难看哦

    回复
    无二八怪小青年 0
    2017/7/5 17:04:28

    楼主,你 是使用 图片命名有规律的吗, 那么后台怎么传图呢? 

        xianzi08280
        2017/7/6 9:31:19
        我也在做类似的功能,应该是循环绑定图片吧。你做好了吗?
        smallhappiness0
        2017/7/6 21:50:22

        后台这块因为我还没工作,不是很懂要怎么传。你可以上网查查

    回复
    无二八怪小青年 0
    2017/7/5 17:01:24

    这可以做后台传图片修改图片吗

    回复
    坚强的小草 0
    2017/7/4 22:27:19

    为什么 我下载的没用,浪费了一个Q币!

        西瓜0
        2017/7/4 22:31:37

        应该是你没有调用好,刚测试,没有问题的。

        smallhappiness0
        2017/7/4 22:57:23

        你可以留你邮箱给我,我发给你= =

        xianzi08280
        2017/7/6 9:33:55

        给我发一份吧,xianzi0828@foxmail.com

    回复
    插班生小明明 0
    2017/7/4 11:42:16
    也许丶释怀 0
    2017/5/21 11:37:17

    有bug?!为什么下载的底部缩略图两边的箭头只能点击一次,第二次开始就没反应了?

        smallhappiness1
        2017/5/21 11:49:58

        你在magnifier.js 51行后加如下代码

        this.$thumbnailBox_prev.click(function () {
                self.$thumbnailBox_wrapper.animate({marginLeft: 0});
        });
        也许丶释怀0
        2017/5/21 13:01:09

        厉害了,没问题了!还有个我自己的问题想问下,把放大镜放到项目当中,报下面的错是什么原因

        6.html:923 Uncaught TypeError: $(...).magnifier is not a function
        也许丶释怀0
        2017/5/21 13:29:46

        找到原因了..

        smallhappiness0
        2017/5/21 21:34:17

        嗯嗯,其实按钮点击那里我只是简单处理了下,还是不够好,如果图片多的情况下,你可以试着修改修改

    回复
    梅州之美 0
    2017/5/13 22:18:38
    不知道效果怎么样
        陈伊虹0
        2017/5/24 17:02:14

        挺好的

        smallhappiness0
        2017/5/26 17:51:58

        Thanks!!!

        momo57l0
        2017/5/30 16:40:17
        很不错
    回复
    我管你 0
    2017/5/11 17:43:29

    这里边的Class在哪设置啊 有 教程吗?

        smallhappiness0
        2017/5/11 21:00:03
        什么?你仔细说说。。。
    回复
取消回复