jquery_jquery를 기반으로 한 스크롤 마우스 확대 이미지 효과

오늘은 사진을 확대하고 축소하는 마우스 스크롤 기능을 실행해 보겠습니다. 인터넷에서 검색해 보면 나타나는 모든 예제는 모두 IE 브라우저만 지원하는 것으로 나타났습니다. 이 기능을 처리하는 해당 DOMMouseScroll이 있습니다. 코드는 다음과 같습니다.

코드를 복사하세요. 코드는 다음과 같습니다. 다음과 같습니다:

$ (function(){
$(".body img").each(function(){
if($.browser.msie){
$(this).bind("mousewheel",function (e){
var e=e||event,v=e.wheelDelta||e.detail;
if(v>0)
resizeImg(this,false);//사진 확대
else
resizeImg(this,true);//이미지 축소
window.event.returnValue = false;//브라우저의 기본 스크롤 제거 event
//e.stopPropagation();
return false;
})
}else{
$(this).bind("DOMMouseScroll",function(event){
if(event.detail<0)
resizeImg (this,false);
else
resizeImg(this,true);
event.preventDefault()//브라우저 기본 스크롤 이벤트 제거

//event.stopPropagation() })
}
})
function resizeImg(node,isSmall){
if(!isSmall){
$( node).height($(node).height() *1.2);
}else
{
$(node).height($(node).height()*0.8); >}
}
});

이 기사의 데모를 보려면 여기를 클릭하세요.
사진 효과를 확대 및 축소하려면 마우스를 굴립니다.