z-indexで重ねたウィンドウの一番手前をスクロールだけしたい【143日目】

何が起こった

<div class="bg">
 <div class="front">
 </div>
</div>

bg {
    width: 100%;
    z-index: 10;
}

front {
    width: 80%;
    z-index: 11;
}

こんな時に、frontをクリックすると、frontもbgも両方クリックイベントが反応した。

falseだと、css含んだ全部の動作が止まる

willow710kut.hatenablog.com

対策

$('.bg').click(function (e) {
        $('.front').hide();
        e.stopPropagation();
});

これで、親要素にイベントは伝播せず、スクロールとかのデフォルトの動作は残る。