2

Jquery 1.8.3私のサイトで使用しています。

このjqueryバージョンではマウスホイールをバインドできませんが、1.4.2バージョンはマウスホイールを正常にバインドしています。

この問題を解決する解決策を教えてください。

注1.8+：マウスホイールをバージョンのみにバインドする必要があります。他のプラグインが依存しているためJquery 1.8+

私のコード例は次のとおりです。

<!DOCTYPE html>
<html>
<head>
<title>Mouse Wheel</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>
<style type='text/css'>
body { text-align: center; }
#res
{
    margin-top: 200px;
    font-size: 128px;
    font-weight: bold;
}
</style>
<script type='text/javascript'>
$(document).ready(function(){
    var num = 0;
    $(document).bind('mousewheel',function(e){
        if (e.wheelDelta > 0)
        {
            $("#res").text(++num);
        }
        else
        {
            $("#res").text(--num);
        }
    });
});
</script>
</head>
<body>
<div id="res">0</div>
</body>
</html>
4

1 に答える 1

4

これがあなたのコードでの実用的な例です、ただmousewheel javascriptプラグインを追加してください：http：//brandonaaron.net/code/mousewheel/demos

<!DOCTYPE html>
<html>
<head>
<title>Mouse Wheel</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.min.js'></script>
<script type='text/javascript' src='http://flexicontent.googlecode.com/svn-history/r1517/trunk/com_flexicontent_v2.x/site/librairies/fancybox/lib/jquery.mousewheel-3.0.6.pack.js'></script>
<style type='text/css'>
body { text-align: center; }
#res
{
    margin-top: 200px;
    font-size: 128px;
    font-weight: bold;
}
</style>
<script type='text/javascript'>

jQuery(document).ready(function($){
    var num = 0;
    $(document).bind('mousewheel',function(e, delta){
        if (delta > 0)
        {
            $("#res").text(++num);
        }
        else
        {
            $("#res").text(--num);
        }
    });
});
</script>
</head>
<body>
<div id="res">0</div>
</body>
</html>
于 2012-12-12T15:59:17.053 に答える