遅延を持つランディングページから自動スクロールします -- javascript フィールド と jquery フィールド と scroll フィールド 関連 問題

Landing page with delay then auto scrolls downwards












0
vote

問題

日本語

私はjQuery / JavaScriptに慣れていて、問題に遭遇しました。

大きなロゴを表示するランディングページを持っています。 自動スクロールが有効になる前に、3秒の一時停止/遅延を希望しています。

現時点で使っているコードは -

js

<事前> <コード> $('html, body').animate({scrollTop: $('#hello').offset().top}, 4000);

HTML

<事前> <コード> <div class="fillwindow" style="background-image:url('#')"> <div class="landing__logo"> <img class="landing__logo-img" src="#"> </div> </div> <div class="fillwindow" id="hello" style="background-image:url('#')"> <div class="nav-header"> <a href="<?php home_url(); ?>portfolio" class="nav-btn js-navBtn">PORTFOLIO</a> </div> <a href="<?php home_url(); ?>portfolio"><div class="nav-hitstate"></div></a> </div>
英語

I'm new to jquery/javascript and have came across an issue.

I have a landing page that displays a large logo. I am wanting a 3 second pause/delay before the automated scroll takes effect.

the code I am using at the moment is-

JS

$('html, body').animate({scrollTop: $('#hello').offset().top}, 4000); 

HTML

<div class="fillwindow" style="background-image:url('#')">     <div  class="landing__logo">         <img  class="landing__logo-img" src="#">     </div> </div>  <div class="fillwindow" id="hello" style="background-image:url('#')">     <div class="nav-header">         <a href="<?php home_url(); ?>portfolio" class="nav-btn js-navBtn">PORTFOLIO</a>     </div>     <a href="<?php home_url(); ?>portfolio"><div class="nav-hitstate"></div></a> </div> 
</div
        
       
       

回答リスト

1
 
vote
vote
ベストアンサー
 

上記のコメントに従って:

<事前> <コード> $(document).ready(function() { setTimeout(function() { ('html, body').animate({scrollTop: $('#hello').offset().top },4000); }, 2000);})
 

As per the comments above:

$(document).ready(function() {  setTimeout(function() {    ('html, body').animate({scrollTop: $('#hello').offset().top },4000);  }, 2000);}) 
</div
 
 
 
 
0
 
vote

helpのためのSideroxylonに感謝します。彼のアドバイスは私が探していた正しい答えでした。

<事前> <コード> $(document).ready(function() { setTimeout(function() { $('html, body').animate({ scrollTop: $('#hello').offset().top },4000); }, 2000); });
 

A big thanks to - Sideroxylon for the help. His advice was the correct answer I was looking for.

$(document).ready(function() {   setTimeout(function() {       $('html, body').animate({          scrollTop: $('#hello').offset().top        },4000);   }, 2000); }); 
</div
 
 

関連する質問

1  使用していないときに左側に隠れるスクロール水平サムネイルナビゲーションを作成しようとしています  ( Trying to create scrolling horizontal thumbnail navigation that hides on left si ) 
次のチュートリアルの説明に従って、次のタイプのスクロールサムネイルナビゲーションを再作成しようとしています。 > http://tympanus.net/codrops/2010/ 05/10 / Scrollable-Thumbs-Menu / 私は親...

1  Scintillaでオートスクロールを作成する方法  ( How make autoscroll in scintilla ) 
Scintillaを使用して単純なVB.NETアプリケーションを持っています。テキストが追加されたときにコントロールを自動スクロールする方法を知っていません。 誰もが助けになることができますか? ありがとう ...

63  要素から窓へのスクロールバブリングを防ぐ  ( Prevent scroll bubbling from element to window ) 
IFrameを含むモーダルボックスウィンドウ(ポップアップ)を持っています。 その内側とその中の内側は、スクロール可能な div があります。 IFrameの内部DIVをスクロールし、その上または下限に達したとき、ブラウザ自体のウィンドウがスクロールを開...

226  jQueryはページ/ iframeの下からスクロールします  ( Jquery scroll to bottom of page iframe ) 
jQueryを使ってiframeまたはページの下部にスクロールする方法は? ...

6  FlowDocumentReaderのスクロールインクリメントを調整するViewModeがスクロールするように設定されているときは?  ( Adjust flowdocumentreaders scroll increment when viewingmode set to scroll ) 
ViewingMode = "Scroll"を使用してFlowDocumentReaderにFlowDocumentを表示しています。マウスのホイールを使用すると、文書は非常にゆっくりとスクロールします。スクロールステップを上げたいのですが。 マウスの...

35  子ページがiFrameをクリックすると、親ページを上にスクロールする方法を説明しますか?  ( How do i scroll parent page to top when child page is click within iframe ) 
iFrame(子ページ)内のリンクをクリックすると、親ページが先頭にスクロールするにはどうすればよいですか。 IFRAMEは親ページより大きい高さが多いため、この問題はページの同じ場所に残る予定です。 おめいつ:親ページと子ページは異なるサブドメインにありま...

0  ブラウザのスクロールスローイメージスピードをスクロールします  ( Browser scroll slow images speed ) 
私は3つの「レイヤ」を持つことができるページを構築しようとしています。 1 - 背景、2 - 画像、3画像。 points_list6 jQuery関数を使用して、ナビゲーションメニューを使用しているときに完全に機能します。ただし、ユーザーがブラウザ...

1  フロッシュページを返します  ( Return page to left on refresh ) 
私は水平スクロールウェブサイトを持っています、そして私はページが更新されたときにページを左の左(元の位置)にリセットしたいのですが。今のように私はjQuery .scrollleftを使ってみましたが、ページが最初にロードされたときにのみ機能することしかできま...

-1  オーバーフローが隠されてスクロールします  ( Overflow hidden and scrolling ) 
私のウェブサイトのホームページに珍しいスクロール機能を作成しようとしていますが、私はそれに取り組むための最良の方法がわからない。 私は背景の特徴を持つ上部(位置:絶対的、高さ:100%)の全画面パネル(パネル1 )を持ちます。ユーザーがこのセクションにあるとき...

88  DIVが下部にスクロールされているかどうかを判断するにはどうすればよいですか。  ( How can i determine if a div is scrolled to the bottom ) 
jQueryや他のJavaScriptライブラリを使用せずに、垂直スクロールバーを持つDIVが一番下までスクロールされている場合は、判断しますか? 私の質問は、下部までスクロールする方法ではありません。私はそれをする方法を知っています。 DIVが既に下部にス...




© 2022 cndgn.com All Rights Reserved. Q&Aハウス 全著作権所有