在一段時間後轉到具有錨點的內容

我在我的網站上有一個「介紹圖像」，用戶可以點擊並使用錨點將頁面向下滾動到內容。那麼，不是每個人都在鏈接上點擊，所以我希望頁面在幾秒鐘後自動滾動到內容（如果用戶沒有定位錨鏈接）。有沒有什麼方法使用JS或CSS可以幫助我做到這一點？在一段時間後轉到具有錨點的內容

這裏的鏈接http://www.bahelitours.com/es/info-test

來源

2017-03-02 Phil

'的setTimeout（）'加上一些不錯的CSS'transition' – Shilly

目標區域爲#info-content。使用setTimeout()可以在一段時間後運行（運行時間爲5000ms或5s，如果您認爲合適的話進行更改），然後查看用戶是否未滾動（$.scrollTop() == 0），如果尚未滾動，請滾動至目標區域。

setTimeout(function() { 
 
    if ($(window).scrollTop() == 0) { 
 
    $('html, body').animate({ 
 
    scrollTop: $('#info-content').offset().top 
 
    },500,"swing"); 
 
    } 
 
},5000);

header,#info-content { 
 
    height: 300vh; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<header></header> 
 
<section id="info-content">info-content</section>

來源

2017-03-02 16:38:47

好，謝謝@邁克爾 - 焦化看起來這是我需要什麼，但是我newie用JavaScript。我嘗試在頁面上使用你的代碼，但它沒有工作:(任何建議？ – Phil

@希爾耶，刪除'標題，＃信息內容{height：300vh; }'這是CSS，你不需要那 - 這只是我的例子 –

@Micheal這是真棒，完美的工作！非常感謝隊友:) – Phil

在一段時間後轉到具有錨點的內容

回答

相關問題