其实这公式可以简化一下X/b = ?/d 不就是 (x/b)*d =? 代码是这样的
var percentX = left/objSmallBox.offsetWidth;
var percentY = top/objSmallBox.offsetHeight ;
objBigBoxImage.style.left = -percentX*objBigBoxImage.offsetWidth+"px"
objBigBoxImage.style.top = -percentY*objBigBoxImage.offsetHeight+"px"
效果是一样的
点击资料下载
后面的50是透明度。IE使用私有属性filter:alpha(opacity),Moz Family使用私有属性-moz-opacity,而标准的属性是opacity(CSS 3, Moz Family部分支持CSS3)。透明度使用百分比或者小数,(alpha(opacity)使用大于0小于100的数值,其实也是百分比)。
结论是对的,X/(B-A) = ?/(D-C) 因为大图和小图都是等比的,所以(B-A )和 (D-C)是等比的,也就是说,是倍数关系。 因此,;已知X,就可以求出?的值,X是,在小图里面的left值,?是在大图里面移动的值,X和?是等比的。
嗯,对的
ev 是evet的缩写
找到问题所在了,网页给的代码中var和后面的变量之间缺少空格
是相对于floatBox的父节点,也就是SmallBox
后面为了解决IE6上的闪烁问题在上面盖了一层mask,在mask上做鼠标移动事件的
知道有这种代码就行了...工作要用的话 谁会自己写呢
解决在ie兼容,看下一集就知道了
当鼠标指针移动到元素上方,并松开鼠标左键时,会发生 mouseup 事件。
哈哈 我也觉得挺逗的 望采纳
[Shadow]解决当页面出现滚动时,放大镜与鼠标发生分离问题:
var left = _event.clientX + document.body.scrollLeft - ......; var top = _event.clientY + document.body.scrollTop - ......;
很简单,只需要加上对应的 document.body.scrollLeft 和 document.body.scrollTop 即可解决.
jquery是js的封装,类似于ssh是java的框架
监听鼠标滑入事件,获取鼠标所处坐标的图片信息, 截取对应大小, 展示于悬浮框之中
先学js啊,jqery只是js的一个代码库
是的。
但是老师是为了讲原理而不是讲怎么实现,老师是为了让大家都可以看懂而不是让一部分有基础的人才可以看懂,所以才会略显繁琐
一些弹窗广告,表单,音视屏窗口的时候,背部(也就是整个浏览器视口)有个半透明的的黑色罩层,就是由这个标签设置的
哦哦哦哦
哈哈,多谢你的答案,其实我估计大部分人不明白的是老师怎么从图片中运用数学的比例来得出他的那个等式而已啦,而且代码还是分开来写,所以说就有些懵了,我开始看也是,后来看到你的才意识到代码把分数等式分开来计算,后来我就直接一条等式来计算了。请看我的代码。
var zoomX = floatLeft*(objBigBoxImage.offsetWidth - objBigBox.offsetWidth)/(objSmallBox.offsetWidth - objFloatBox.offsetWidth) var zoomY = floatTop*(objBigBoxImage.offsetHeight - objBigBox.offsetHeight)/(objSmallBox.offsetHeight - objFloatBox.offsetHeight) objBigBoxImage.style.left = -zoomX + "px"; objBigBoxImage.style.top = -zoomY + "px";
不太理解你要问的到底是什么?如果要问有没有鼠标直接在元素里的相对坐标,那是没有的,必须计算得出
其实?的求解就是一个比例问题,个人感觉老师的解法有点复杂。
有x/A = ?/C,可以转化为:?=x*C/A
其实将老师的式子化简可以得到上式的
x/(B-A) = ?/(D-C) 且有条件 B/A = D/C成立
x/[(B/A-1)*A] = ?/[(D/C-1)*C]
(x/A)/(B/A-1) = (?/C)/(D/C-1) 分母相等
有x/A = ?/C
mark 是解决ie6兼容特意增加的一个标签 不知你说的定义是嘛意思
var objBigBox = document.getElementById("big-box");
var objBigBoxImage = objBigBox.getElementsByTagName("img")[0];
document.getElementById("big-box").getElementsByTagName("img")[0]