当前位置: 首页 > 图文教程 > 网络编程 > Javascript > javascript 放大镜效果js组件 qsoft.PopBigImage.v0.35 加入了chrome支持

Javascript
一个特殊的排序需求的javascript实现代码
javaScript 简单验证代码(用户名,密码,邮箱)
支持ie与FireFox的剪切板操作代码
使用JS判断是否数字和小数点组合的数字的两中方法比较(isNaN和逐判断)
javascript 表单验证常见正则
IE FF OPERA都可用的弹出层实现代码
PPK 谈 JavaScript 的 this 关键字 [翻译]
JavaScript 自动在表格前面增加序号
点击按钮后 文本框变为Select下拉列表框
js类的静态属性和实例属性的理解
点击文章内容处弹出页面代码
点击下载链接 弹出页面实现代码
签名框(Textarea)限制文字数量并适时提示
JavaScript CSS 通用循环滚动条
js removeChild 障眼法 可能出现的错误
面向对象的javascript(笔记)
JavaScript 浮点数运算 精度问题
JavaScript 接收键盘指令示例
CSS 美化表格边框为凹陷立体效果的实现方法
JavaScript 控制文本框的值连续加减

Javascript 中的 javascript 放大镜效果js组件 qsoft.PopBigImage.v0.35 加入了chrome支持


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 482 ::
收藏到网摘: n/a

一般页面的的图片为了布局考虑,显示大小都小于实际大小。 鼠标在图片上移动时,在旁边展示一个跟此图片显示大小一样的层。并讲鼠标附近区域对应的原始图片的区域按原始大小显示在这个层中。 qsoft.PopBigImage.v0.35.demo.rar
新特性:
1、不需要onload加载和指定id了,在img中加个标记就好,第一鼠标进入时动态生成显示层
2、可以随意调整,右边的展示层的大小了。
qsoft.PopBigImage
version:0.35
author: [email protected]
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);"
下载地址 http://www.ruanchen.com/"http://img.ruanchen.com/" style="color: #000">http://img.ruanchen.com/nline/PopBigImage/qsoft.PopBigImage.v0.35.html