-2

imgでクリックイベントをトリガーするときにブラウザーのジャンプを停止できないため、フロントエンドを構築して少し困惑しています。

event.preventDefault() または return false のいずれかでそれができると思いましたが、明らかに何かが欠けており、次に何を試せばよいか完全に途方に暮れています!

ここにコードがあります

    $("#imgViewer-thumbs").find("img").click(function (event) {
        event.preventDefault();
        var $imgViewPane = $("#imgViewPane"),
                $selectedImage = $imgViewPane.find(".selected-image"),
                $clickedImage = $(this),
                $clickedImageIndex = $clickedImage.prevAll().length + 1,
                $maxIndex = $clickedImageIndex + $clickedImage.nextAll().length,
                $targetImage = $imgViewPane.find(":nth-child(" + $clickedImageIndex + ")");

        if (!$targetImage.hasClass("selected-image")) {
            $selectedImage.fadeOut(100, function () {
                $targetImage.addClass("selected-image");
                $selectedImage.removeClass("selected-image");
                $targetImage.fadeIn(100);
            });
        }
        console.log('Returning false');
        return false;
    }
    );

編集: ここで jsfiddle でイメージビューアーをセットアップしますhttp://jsfiddle.net/tEXaa/

4

2 に答える 2

3

問題は、画像コンテナ"#imgViewPane"が高さを保持していないことです。そのため、前の画像がフェードアウトして"#imgViewPane"高さが失われ、その結果、ページのスクロール位置が失われます。

あなたのフィドルを更新しました：http://jsfiddle.net/tEXaa/1/

于 2013-06-09T13:55:47.747 に答える