qsoft.PopBigImage v0.35 更新:新增 Chrome 支持及动态加载优化

作者:安全边界时间:2026-10-23 13:54:28浏览:360

qsoft.PopBigImage 组件更新至 v0.35 版本,主要新增对 Google Chrome 浏览器的支持。该版本优化了初始化流程,无需 onload 加载或指定 ID,仅需在 img 标签添加标记即可。鼠标首次进入图片时动态生成显示层,并支持自由调整展示层大小,兼容 IE 与 Firefox,解决了偏移对齐问题。

qsoft.PopBigImage.v0.35.demo.rar


新特性:


1、不需要 onload 加载和指定 id 了,在 img 中加个标记就好,第一鼠标进入时动态生成显示层


2、可以随意调整,右边的展示层的大小了。



组件版本信息与功能演进

qsoft.PopBigImage


version:0.35


author: kimmking@163.com


date: 2009年3月26日 15:20:50


功能描述:


一般页面的的图片为了布局考虑,显示大小都小于实际大小。


鼠标在图片上移动时,在旁边展示一个跟此图片显示大小一样的层。


并讲鼠标附近区域对应的原始图片的区域按原始大小显示在这个层中。


v0.1:实现了IE下的鼠标滑动小图动态展示对应的放大局部图的功能。


v0.2:实现了Firefox的兼容支持,修改了IE下传递偏移0,0时有空隙的对不齐问题。


v0.3:实现了鼠标第一次进入图片时动态创建显示层。提供了一个静态创建方法。


v0.35:加入了对google chrome浏览器的支持。


参数配置详解

参数描述:


origImageId: 要绑定的img对象的id


dx:展示大图相对于绑定的img对象右方的x轴偏移量


dy:展示大图相对于绑定的img对象上方的y轴偏移量


mx:展示层的宽


mx在0到1之间时,取大图的宽*mx的值与小图的宽中的较大者


mx在1到10之间时,取小图的宽*mx的值与大图的宽中的较小者


mx大于10时,确保mx在大小图的宽之间,超出的话,取边界值


my:展示层的高


参照mx的值


bflag:create方法中渲染完后是否将展示层显示出来,


在onmouseover事件中使用true参数


在页面加载时初始化的话使用false参数


代码集成与使用示例

用法:


1、页面加载后统一预先加载,在页面上添加JavaScript脚本


window.onload = function(){


new qsoft.PopBigImage("orig",20,0,2,2).render();


//或是 qsoft.PopBigImage.create("orig",20,0,2,2,false).render();


}

或是


2、鼠标第一次进入图片时才加载本图片的显示层,在img标签中添加


onmouseover="qsoft.PopBigImage.create(this,20,0,2,2,true);"


下载地址 https://www.jb51.net/codes/12597.html


演示地址:http://img.jb51.net/online/PopBigImage/qsoft.PopBigImage.v0.35.html

作者最新文章