關閉彈出框後返回頁面到原始的scrollTop位置

Question

我有一個按鈕，它修復了頁面內容的位置，然後在窗體從右側滑入時將其向左推。

這工作正常，除了一件事。當用戶稍微向下滾動頁面並點擊按鈕時，它成功修復了位置。但是，當他們關閉此表單時，頁面不會返回到原始位置......它會將用戶帶回頁面的頂部。我已經發布了下面的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); 
       }); 
      }); 
     }); 
    }); 

Answer 1

您使用的是本地的變量，因爲你正在使用var：

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

相反，降var，以便在.closeme點擊功能。您剛開始時已使用var。所以：

currentscrollpos = $(window).scrollTop(); 

這樣，最初的變量將被設置，可以通過這兩個函數來訪問。目前，您正在聲明a#testbutton點擊函數中的另一個變量，使原始變量保持不變。

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