1

この Web サイトのこのスライダーを見て、CTRL + +またはCTRL + - (ズームイン、ズームアウト)を押すと、私の言いたいことが理解できます。

ページをズームするときに、スライダーとそのコンテンツのサイズを同じに保ちます。

jQuery/JavaScript スクリプトを使用していると思いますが、よくわかりません。ありがとうございました。

4

2 に答える 2

0

あなたはこのようなことを試すことができます

window.onresize = function()
{
    var elementWidth = window.innerWidth
    var element = document.getElementById('element')
    element.style.width = parseInt(elementWidth)/2 // for example if you want it always be half of page 
}
于 2013-06-26T16:06:37.417 に答える
0

次のように、イベント ハンドラーを使用して、スライダーの寸法を簡単に再計算できます。

$(document).on('keydown', function(e){
    if(e.ctrlKey) {

        if(e.which === 187) {
            // zoom-in, +
        }

        if(e.which === 189) {
            // zoom-out, -
        }

    }
});

アップデート

resizeウィンドウサイズが変更されたかどうかを確認するには、-event を使用するだけです。

$(window).on('resize', function(){
    alert(true)
});

http://fiddle.jshell.net/aZagW/1/

Update2

使用するスクローラーには独自のメソッドがありますrefresh。

新しい状態に基づいてカルーセルを更新します。ウィンドウのサイズ変更イベントでこのメソッドを呼び出すことにより、カルーセルをレスポンシブにすることができます。

https://github.com/richardscarrott/jquery-ui-carousel#refresh-rs-carouselcarouselrefresh

于 2013-06-26T15:57:14.863 に答える