就是我页面里有一张图片,鼠标滚轮可以放大缩小这张图片,但是鼠标滚动的同时滚动条也跟着滚了,如何在鼠标移到图片上时禁止滚动条滚动呢
解决方案 »
- js 焦点获得和失去问题
- 求助一个简单问题~
- javascript操作cookie问题
- 框架左列菜单自适应高度出现问题,懂的帮一下
- 我的页面中有很多<input type="text">标签,这些标签我均要设置onclick,onchange等事件函数,我该怎么设置?
- 菜鸟提问:关于 window.navigator的问题
- 请教高手 把vbscript的例子改成javascript 嘿嘿 谢谢了
- 十万火急,问一个confirm的问题,
- 将一字符串中的key进行替换
- 我的菜单为什么遮不住底下的Select?
- 新手求救: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 这个可是自己手写的 要给分啊,