0

トップバーの div を非表示にして切り替える関数を作成しました。

jQuery(document).ready(function($) {

        $.fn.myTopBar = function() {

                var sipPosTop = 0;
                var topDivHeight = $("#top").outerHeight();

                $('#top').css('top' , -topDivHeight+10).show().animate({top: '+=0'}, 2000);


                $("#top-toggle").click(function(e) {
                    e.preventDefault();
                    $("#top").animate({ top: sipPosTop }, 200, 'linear', function() {
                        if(sipPosTop == 0) { sipPosTop = -topDivHeight+10; }
                        else { sipPosTop = 0; }
                    });
                });
        };
});

ページの読み込みではうまく機能しますが、ウィンドウのサイズを変更すると #top div の高さが変わり、レイアウトが崩れます。ウィンドウのサイズ変更時に再計算して関数を再実行するにはどうすればよいですか? 私は次のことを試しました:

jQuery(document).ready(function($){
    $.fn.myTopBar();
});

jQuery(window).resize(function($){
    $.fn.myTopBar();
});

しかし、うまくいきません。助けてくれてありがとう

4

1 に答える 1

2

編集-- あなたのコメントに基づいて、私はこのプラグインを作成しました。このプラグインは (願わくば) あなたが求めている機能を備えています。どちらといえば、それを行う方法に関する情報を抽出できる場合があります。

これでプラグインを呼び出します-

$(function () {
    $('.someFlyoutContainerClass').flyout({
        flyButton : $('.someButtonClass'), // button that toggles the flyout
        topOffset : 50, // (px) offset from the top of the window
        fade : { // (fade speeds/durations) -- remove object if not needed
            inSpeed : 350,
            easingIn : 'swing', // by removing easing, it will default to linear
            outSpeed: 250,
            easingOut : 'swing'            
        },
        slide : { // (slide speeds/durations) -- remove object if not needed
            inSpeed : 350,
            easingIn : 'swing',
            outSpeed : 250,
            easingOut : 'swing'      
        },
        closeButton : $('.close-flyout'), // you may remove if not needed
        clickOffClose: true // click anywhere but modal/flyout to close it
    });
});

スクリプトの動作バージョンは次のとおりです -- (12/13 更新) http://jsfiddle.net/jmsessink/fC8ht/5/

ご不明な点がございましたら、お気軽にお問い合わせください。

于 2012-12-12T16:31:45.557 に答える