使網站退出頁面頂部

因此，問題是每當我的網頁/模式顯示在我的網站上時，它往往會使網站跳回到頂端。我想要下面是說明來模擬問題，所以你可以看到它：使網站退出頁面頂部

轉到此鏈接：在右上角http://jsbin.com/saditujuli/edit?html,css,js,output
，單擊 '運行與JS'。滾動至「輸出」部分的底部，然後單擊位於
右上角的固定藍色代碼。
從那裏，你可以看到網站從半透明封面背景後跳，你也可以告訴當你退出（封面，模式）網站回到頂部，所以它跳了起來。

當蓋子出現，它被認爲是位置：固定的，因此它不會move.It打算留在原地被點擊，而不是跳躍的藍色股票的時候，但我不」噸知道如何解決它。任何幫助表示感謝。提前感謝！

2016-08-25 Kaleb Meeks

如果這是你原來的代碼：

$('.responsive_click').on('click',function(){ 
     $('.cover').fadeIn('slow'); 
     $('.container').css('position','fixed'); 
    }); 

    $('.close-sign').on('click',function(){ 
     $('.cover').fadeOut('slow'); 
     $('.container').css('position','relative'); 
    });

我改變「.container」到‘身體’和‘位置是：固定/相對’溢出-Y：隱藏/滾動」爲在這裏看到：

$('.responsive_click').on('click',function(){ 
    $('.cover').fadeIn('slow'); 
    $('body').css('overflow-y','hidden'); 
    }); 

    $('.close-sign').on('click',function(){ 
    $('.cover').fadeOut('slow'); 
    $('body').css('overflow-y','scroll'); 
    });

這會停止背景跳回到頂部和背景滾動而藍色覆蓋層覆蓋層已關閉。

編輯：對於移動，試圖將window.ontouchmove = preventDefault; 像這樣：

$('.responsive_click').on('click',function(){ 
    $('.cover').fadeIn('slow'); 
    $('body').css('overflow-y','hidden'); 
    window.ontouchmove = preventDefault; 
    });

，只是改變 '的preventDefault' 到 '空' 關閉對話框時。

來源

2016-08-25 01:03:02

那固定的跳轉問題上的手機和PC，但在移動現在它仍然是滾動而不是位置：固定在蓋上來。 –

您可以嘗試使用我添加到我的答案中的移動編輯。 –

我用你的方式更新了jquery，但當退出按鈕被點擊時，我需要撤消preventDefault（）和stopPropagation（）的幫助，這樣網站纔會恢復正常。 http://jsbin.com/saditujuli/edit?html,css,js,output –

如果您嘗試將容器位置更改爲固定值，該怎麼辦？

position:fixed;

來源

2016-08-25 01:03:31 evilrod

這隻會使內容不動。看看這裏的問題的例子：http://jsbin.com/saditujuli/edit?html,css,js,output –

我認爲這是他想要的 – evilrod

我的意思是啊。但我已經在jQuery中完成了。 –

$('.responsive_click').on('click',function(){ 
    $('.cover').fadeIn('slow'); 
    $('.container').css('position','absolute'); 
    }); 

    $('.close-sign').on('click',function(){ 
    $('.cover').fadeOut('slow'); 
    $('.container').css('position','relative'); 
    });

更改容器的位置是：絕對

來源

2016-08-25 07:19:03

使網站退出頁面頂部

回答

相關問題