ホームページ >ウェブフロントエンド >jsチュートリアル >マウスホイール制御画像ズーム効果を実装するjsメソッド_javascriptスキル

マウスホイール制御画像ズーム効果を実装するjsメソッド_javascriptスキル

WBOY
WBOYオリジナル
2016-05-16 16:13:381522ブラウズ

この記事の例では、マウス ホイール コントロールの画像ズーム効果を JS で実装する方法を説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。

コードをコピー コードは次のとおりです:


<頭>


マウス ホイールを使用してスクロールし、画像のズームインとズームアウトを制御します
<スクリプト言語="javascript">
関数 bbimg(o){
varzoom=parseInt(o.style.zoom, 10)||100;
ズーム =event.wheelDelta/12;
if (zoom>0) o.style.zoom=zoom '%';
false を返します;
}



マウスを画像の上に置いてクリックし、マウスホイールを回して試してみてください







この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。