zoukankan      html  css  js  c++  java
  • javascript图片放大效果

    类似京东的商品展示效果,先查看演示示例

    1.图片和放大使用不同的图片,并指定显示的方位(大小图片要比例相同)
    也可以指定放大倍数(相对于小图片计算)
    2.使用同一图片
    给小图片设定宽或高,这里指定了:style="height:300px;" ,(偷懒模式,^o^,后面几个也是这样)
    3.放大图片显示到指定的容器中
    图片预览:
    4.显示大图的div以指定倍数
    点击下载js源码
    PS:为了避免ff下的出问题(在ff下如果网页加载实在太慢,可能无法获取图片大小)最好将代码放在onload中执行
    update: 感谢danica7773,按其建议2009-11-15 21:40,加上 自定义显示层的样式,显示和隐藏的事件, 2009-11-16 11:00, 添加参数自定义位置 默认viewerPos:{h:10,v:0},h,v为负数时分别表示左边和上边


  • 相关阅读:
    UOJ#80. 二分图最大权匹配 模板
    BZOJ2243: [SDOI2011]染色
    LA5713 Qin Shi Huang's National Road System
    BZOJ1977: [BeiJing2010组队]次小生成树 Tree
    LA5009 Error Curves
    BZOJ1013: [JSOI2008]球形空间产生器sphere
    BZOJ2733: [HNOI2012]永无乡
    BZOJ1552: [Cerc2007]robotic sort
    BZOJ3223: Tyvj 1729 文艺平衡树
    网络流24题(24/24)
  • 原文地址:https://www.cnblogs.com/sohighthesky/p/imagezoom.html
Copyright © 2011-2022 走看看