就是我页面里有一张图片,鼠标滚轮可以放大缩小这张图片,但是鼠标滚动的同时滚动条也跟着滚了,如何在鼠标移到图片上时禁止滚动条滚动呢
解决方案 »
- canvas动画效果..高手指点
- javascript关于密码框的问题
- 推荐一套简单易懂的JAVASCRIPT教程
- 关于含有滚动条的标签绝对定位问题
- 求一段图片无法显示,用另一张图片替换的JS代码
- 请问函数和函数之间以及类的方法之间要不要考虑避免依赖关系?
- html中有一img,id为img2,如何在javascript中得到这个img?
- 如何在onload时将页面中的下拉跳转设置好呢?
- 关于jsp打印的问题!!!!
- html与java后台通过ajax交互 没反应不能正常调用
- 新手求救:table中行、列的高亮显示?
- 刚刚写了一个抓取百度top50 mp3的小程序,可以运行了,但是效率很低,盼高手指导,优化
var firefox = navigator.userAgent.indexOf('Firefox') != -1;
function MouseWheel(e) {
///对img按下鼠标滚路,阻止视窗滚动
e = e || window.event;
if (e.stopPropagation) e.stopPropagation();
else e.cancelBubble = true;
if (e.preventDefault) e.preventDefault();
else e.returnValue = false; //其他代码
}
window.onload = function () {
var img = document.getElementById('img');
firefox ? img.addEventListener('DOMMouseScroll', MouseWheel, false) : (img.onmousewheel = MouseWheel);
}
</script><div style="height:100px"></div>
<img src="http://avatar.profile.csdn.net/C/5/A/1_px372265205.jpg" id="img" style="width:200px"/>
<div style="height:1000px"></div>
放大缩小自己编写逻辑就行了,获取是向上还是向下滚动,然后设置img的大小。。javascript鼠标滚轮滚动事件
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="jquery-1.9.1.js" type="text/javascript"></script>
<script type="text/javascript">
var pic=(function(){
var px=0;
var size=100
// 获取鼠标轨迹上或者下
var getmovepx=function(){
return px=event.wheelDelta;
}
var getsize=function(){
return size+"%";
}
return {
change:function(){
var v=getmovepx();
/*判断鼠标滚轮是向上滚动还是向下滚动*/
if(v>0){ // 如果滚轮向上滚动
if(size<200){// 限制图片大小最大200%
size+=20;
}
}else{ // 如果滚轮向下滚动
if(size>20){ // 限制图片大小最小20%
size-=20;
}
}
$("#test01").css({"width":getsize(),"height":getsize()});
return false;
}
}
}());
</script>
</head>
<body>
<img id="test01" onmousewheel="return pic.change();" src="test.jpg"/>
</body>
</html>
lz 这个可是自己手写的 要给分啊,