1

マウスホイールを使用して div の幅を変更できるようにしたいと考えています。
これを行うのは非常に難しいと思います (少なくとも私にとっては難しいことです) が、誰かがそのような jquery または javascript コードを書いたことがあるのではないかと思いました。

いくつかのコンテキストで言えば、ここに私のウェブサイトの関連部分があります: http://jsfiddle.net/XGERP/1/
そして、ここに完全なウェブサイトがあります。どのくらいの大きさにするかはユーザーに決めてもらいたい #main divです。

4

2 に答える 2

8

あなたの空想をくすぐる jquery を次に示します。Chrome、Firefox、および IE11 で動作することがテストされています。

$(document).ready(function(){
    $('#main').bind('wheel mousewheel', function(e){
        var delta;

        if (e.originalEvent.wheelDelta !== undefined)
            delta = e.originalEvent.wheelDelta;
        else
            delta = e.originalEvent.deltaY * -1;

            if(delta > 0) {
                $("#main").css("width", "+=10");
            }
            else{
                $("#main").css("width", "-=10");
            }
        });
    });
于 2013-06-24T19:54:08.200 に答える
0

Jquery Zoomを使用できます...

http://www.jacklmoore.com/zoom/

次に、ユーザーがホバーするのと同じように、少し近づいて読むことができます...

テキストで機能するかどうかはわかりませんが、実際には調べていません

または、あなたはこのようなことをすることができます...

 $('#main').mousewheel(function(event, delta) {
var delta_px = delta > 0 ? "+=50" : "-=50";
$(this).css('width', delta_px);
});

mousewheelそのためには拡張プラグインが必要です...

http://archive.plugins.jquery.com/project/mousewheel

動作するデモをここに示します。マウスホイール スクリプトがすべての上にあり、必要な実際の jquery が一番下にあります。

デモはこちら

于 2013-06-24T19:48:09.533 に答える