您的位置:首页 > 其它

JQ鼠标滚动的两个小应用

2012-07-03 13:56 176 查看
JQ插件jquery.mousewheel.js

1.放大缩小图片:

<img class="logo" src="http://img03.taobaocdn.com/tps/i3/T1ogqgXfXeXXXXXXXX-168-42.png" alt="" />
<script>
$(function(){
$(".logo").mousewheel(function(objEvent, intDelta){
var o = $(".logo").width();
if(intDelta>0){
o = o - 10;
}else{
o = o + 10;
}
$(".logo").width(o);
});
})
</script>


2.鼠标滚动改变input值

<input type="text" id="txt1" value="0" class="txt"/>
<input type="text" id="txt2" value="10" class="txt"/>
<input type="text" id="txt3" value="-10" class="txt"/>
<input type="text" id="txt4" value="10.4" class="txt"/>
<script>
$(function(){
$(".txt").mousewheel(function(objEvent, intDelta){
ScrollText(this,intDelta);//intDelta代表鼠标滚动,向上时,intDelta大于0。
});
})

function ScrollText(oTxt,arg){
oTxt.focus();
var _value=parseInt(oTxt.value);
if(arg>0){
_value++;
}else{
_value--;
}
oTxt.value=_value;
oTxt.select();//选取效果
}
</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: