图片放大缩小效果
效果在附件里，麻烦下载来看吧
<html>
<head>
<title>Simple jsp page</title>
<link type="text/css" href="js/css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="stylesheet" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var img=$("img");
img.draggable()
var slider = $( "<div id='slider'></div>" ).insertBefore( "#big" ).slider({
min: img.height(),
max: 800,
range: "min",
value: 1,
slide: function( event, ui ) {
// alert(ui.value)
resizeImg("img",ui.value)
//select[ 0 ].selectedIndex = ui.value - 1;
},
change:function(event, ui){
resizeImg("img",ui.value)
}
});
$('#big').bind('mousewheel', function(event, delta){
var i=img.height();
if(delta>0){
//alert(i)
i=i+10;
slider.slider( "value", i );
}else{
i=i-10;
slider.slider( "value", i );
}
});
function resizeImg(node,value){
$(node).height(value);
}
})
</script>
</head>
<body>
<div id="big" style="height:500px;overflow: hidden;width: 500px">
<img src="tupian.jpg" style="cursor: move"/>
</div>
</body>
</html>
分享到：
相关推荐
滚动鼠标滑轮放大缩小图片，图片不变，但可放大缩小。。。
js实现图片在div内滚轮放大缩小拖动，有滚动条，双击回原状，无插件，赠送网上搜罗的其他的一些图片放大缩小文件，在每个压缩包是一个，打开压缩包里的网页文件就可以看效果。本人的在“自己的.html”里，记事本打开...
通过鼠标滚动来放大或缩小图片，提供了一个属性src来让用户自己添加图片。该功能被我封装成一个用户自定义控件了，有源代码。
wpf实现鼠标滚轮放大缩小，键盘上下键放大缩小
jquery.mousewheel.min.rar
类似Windows图片查看器，实现图像的缩放，滑动鼠标中间的滚轮，可以实现图像的逐级缩放。类似Windows图片查看器，实现图像的缩放，滑动鼠标中间的滚轮，可以实现图像的逐级缩放。
有注释
鼠标滑轮将物体放大缩小 Posted on 2013年04月02日 by U3d / Unity3D脚本/插件/被围观 218 次 鼠标滑轮将物体放大缩小的Un
wpf项目，以鼠标为中心，利用MatrixTransform矩阵变换来放大缩小控件。仅需9行关键代码。
这个是一个vc视图缩放的实例代码，相信对你的程序会有帮助。
头像截取插件（拖动丶鼠标滑轮丶放大缩小更改图片样式）
现在是按下SHIFT+鼠标左键 放大图片;ALT+鼠标右键 缩小图片 如何修改成 鼠标滑轮向上滚动 放大图片;向下滚动 缩小图片呢?
1、开发环境： 基于 VS2019 基于C#语言 ...C# 鼠标滑轮控制picturebox以图像的中心点放大缩小 3、源代码解析地址为： https://blog.csdn.net/hgaohr1021/article/details/129091827?spm=1001.2014.3001.5502
Protel99se增加鼠标滚轮放大缩小功能,只需滑动鼠标滑轮就能改变电路图的大小。
鼠标滑轮滚动事件
解压后，打开picview.html，鼠标左键点击图片，同时拖动，滚动滑轮，可以放大缩小。希望对大家有帮助
源码根据鼠标滑轮的滚动，改变图片框的大小。
labview 2018 实现鼠标滚轮缩放 XY图 通过鼠标滚轮可以缩放 图表的波形。 按ctrl 键， 可以实现Y轴的缩放。
Unity3d UGUI以鼠标位置点为中心缩放图片项目源码 建议先看说明：https://blog.csdn.net/qq_33789001/article/details/117749837