ホームページ > ウェブフロントエンド > jsチュートリアル > 比较方便的onMouseWheel缩放图片效果[原创]_图象特效

比较方便的onMouseWheel缩放图片效果[原创]_图象特效

WBOY
リリース: 2016-05-16 19:26:34
オリジナル
1153 人が閲覧しました
复制代码 代码如下:

  
  
  
onMouseWheel缩放图片效果-www.jb51.Net

<script> <BR>function bbimg(o) <BR>{ <BR> var zoom=parseInt(o.style.zoom, 10)||100; <BR> zoom+=event.wheelDelta/12; <BR> if (zoom>0) o.style.zoom=zoom+'%'; <BR>} <BR>function addthis() <BR>{ <BR>var e=window.event?window.event:e; <BR>var srcE=e.srcElement?e.srcElement:e.target; <BR>if(!srcE) return; <BR>//author:reterry(dxy) www.jb51.net欢迎转载,转载时请写明出处。 <BR>if (String(srcE.tagName).toLowerCase()=='img'){ <BR>//alert('好'); <BR>bbimg(srcE) <BR>} <BR>} <BR>function backthis(){ <BR>var e=window.event?window.event:e; <BR>var srcE=e.srcElement?e.srcElement:e.target; <BR>if(!srcE) return; <BR>//author:reterry(dxy) www.jb51.net欢迎转载,转载时请写明出处。 <BR>if ((String(srcE.tagName).toLowerCase()=='img')&&(window.event.ctrlKey)){ <BR>//alert('好'); <BR>srcE.style.zoom='100%'; <BR>}} <BR>document.onmousewheel=addthis; <BR>document.onmouseout=backthis; <BR></script>
比较方便的onMouseWheel缩放图片效果[原创]_图象特效

鼠标滑轮滚动查看效果,Author:reterry(dxy) www.jb51.net欢迎转载,转载时请写明出处。
按住ctrl键然后鼠标从图片上移开,图片可恢复原始大小

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート