1

私は非常に長い間読者ですが、この辺りでコメントはほとんどありません。質問があるたびに、実際に何かを尋ねる前に答えを探すことができました。私は怠惰にならないように上手になります。

とにかく、私は最近自分自身にもっとjQueryを教えてきました、そして私は私がただ検索することができない問題に遭遇しました。私よりも多くの教育を受けた目が必要です。これはまだInternetExploderと完全には互換性がないことに注意してください（別のスレッドの会話）

このフィドルの場合：http：//jsfiddle.net/29Aat/65/

下からカーテンの上下効果にマウススクロールをバインドしています。それは私の目的には十分に機能します。下にスクロールすると、メインコンテンツが表示されます。上にスクロールすると、ウェルカム画面が表示されます。

余談ですが、これをモバイル解像度で開こうとしないでください...設定が完了していません。言うまでもなく、たくさんのレイヤーが飛び交うことはありません。

だから私はブラインドを上げ下げするための2つの主要な機能を持っています。

showit（）hideit（）

// Function to show #main-content in standard resolution
function showit() {
    if ($('#main-content').hasClass('hideit')) {
        $('#main-content').removeClass('hideit').addClass('showit');
        $('#wrap').removeClass('cursor');
        $('#main-content').stop().animate({
            height: '+=' + realheight,
            opacity: 0.7
        });
        $('#welcome').stop().animate({
            opacity: 0,
            top: '-=10'
        }, 600).delay(400).animate({
            top: midpoint
        }, 100);
    }
}

// Function to hide #main-content in standard resolution
function hideit() {
    if ($('#main-content').hasClass('showit')) {
        $('#main-content').removeClass('showit').addClass('hideit');
        $('#wrap').addClass('cursor');
        $('#main-content').stop().animate({
            height: '-=' + realheight,
            opacity: 0
        });
        $('#welcome').stop().animate({
            opacity: 1,
            top: '+=10'
        }, 600);
    }
}

マウススクロールがhideit（）を呼び出すと、カーテンが完全に下がります。

赤い「X」をクリックしてhideit（）（メインコンテンツカーテンの右上隅）を呼び出すと、正しく実行されません。カーテンが下がる代わりに、再び上がります。

ここに誰かがそれを説明するのを手伝ってくれることを願っています。私は私の知恵の終わりにいます。

4

1 に答える 1

1

あなたの問題は伝播です。.closeitボタンは内側にあります#wrap。これは、赤いXをクリックすると、hideit関数は正しく実行されますが、クリックイベントが伝播し、最終的には#wrapそれを処理して実行されることに到達することを意味しshowitます。その結果、奇妙な効果が見られます。

event.stopPropagation()次のように、閉じるボタンのイベントハンドラーのメソッドを使用して伝播を停止する必要があります。

// Activate the close button
$(".closeit").click(function (e) {
    hideit();
    e.stopPropagation();
});

フィドルを修正しました（モバイル関連のものも武装解除したので、正しく表示できました）

于 2013-03-07T01:51:06.483 に答える