1

ページコンテンツの位置を固定し、フォームを右からスライドさせながら左に押すボタンがあります。

これは、1つのことを除いて正常に機能しています。ユーザーがページを少し下にスクロールしてボタンをクリックすると、位置が正常に修正されます。ただし、その後このフォームを閉じると、ページは元の位置に戻りません...ユーザーはページの先頭に戻ります。問題をよりよく説明するのに役立つかもしれないjqueryを以下に投稿しました。

ここにjsfiddleの例もあります...

http://jsfiddle.net/CMbBC/

    var pageContents;
    var currentscrollpos;
    $(document).ready(function() {
        $("a#testbutton").live('click', function() {
            var currentscrollpos = $(window).scrollTop();
            var pageContents = $("body").html();
            $("body").html("");
            $("<div class='pageContainer'>" + pageContents + "</div>").prependTo("body");
            $(".pageContainer").css({'position':'fixed','top':currentscrollpos*-1});
            $("html, body").animate({ scrollTop: 0 }, 0);
            $("<div class='blackout'></div>").appendTo("body");
            $(".blackout").css("opacity",0.8).fadeIn('slow', function() {
                $("<div class='popupPanel'><a class='closeme'>close</a></div>").appendTo("body");
                $(".popupPanel").animate({
                    right: "0px"
                }, 500, function() {
                    $(".popupPanel").css("position","absolute")
                });
                $(".pageContainer").animate({
                    left: "-200px"
                }, 500, function() {
                });
                $("a#testbutton").append(currentscrollpos)
            });
            return false;
        });

        $('.closeme').live('click', function() {
            var pageContents = $(".pageContainer").html();
            $(".popupPanel").css("position","fixed").animate({
                right: "-200px"
            }, 500, function() {

            });
            $(".pageContainer").animate({
                left: "0px"
            }, 500, function() {
                $(".blackout").fadeOut('slow', function() {
                    $(".blackout").remove();
                    $("body").html(pageContents);   
                    $("html, body").animate({ scrollTop: currentscrollpos }, 0);
                });
            });
        });
    });
4

2 に答える 2

2

を使用しているため、ローカル変数を使用していますvar：

var currentscrollpos = $(window).scrollTop();

代わりに、クリック機能var内でアクセスできるようにドロップします。.closemeあなたは最初からすでに使っvarていました。それで：

currentscrollpos = $(window).scrollTop();

このようにして、最初の変数が設定され、両方の関数からアクセスできます。現在、クリック関数内で別の変数を宣言しa#testbuttonており、元の変数は変更されていません。

http://jsfiddle.net/pimvdb/CMbBC/2/。

于 2011-09-20T12:06:45.403 に答える
0

このコードを使用して、ブラウザから閉じたページの位置に戻ることができます

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
    var currentposition;
    $(document).ready(function(){                    
        $(window).scroll(function(){
            var scrollPos = $(document).scrollTop();
            console.log("scrollPos:"+scrollPos);
                            
            localStorage.setItem("key",scrollPos);                            
        });
        currentposition=localStorage.getItem("key");
                                                   
        window.scrollTo(0,currentposition);
        alert("currentposition:"+currentposition);                    
    });
</script>

于 2019-11-04T15:14:57.940 に答える