問題タブ [anchor-scroll]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - オフセット付きのスムーズ スクロール アンカー (jquery)
次のコードを使用して、サイトのアンカーにスムーズなスクロールを追加します。私はこれを200pxでオフセットしたいスティッキーヘッダーIDを持っているので
jquery - jquery+adobe muse の問題 - コードの問題を解決する方法: ダイナミック ボタン ナビゲーションの前/次のアンカー?
私は、Adobe Muse を強化するために、アンカーとジャンプ/スクロール コードベースのウィジェットを使用して、パネルからパネルへのキーボード対応ナビゲーションを備えた Web コミックに取り組んでいます。
上矢印と下矢印のキープレスと同様の方法でアクションをトリガーする最上位フレームに配置された動的ボタンのセットを使用して、モバイル ユーザーがナビゲーション オプションを利用できるようにしたいと考えています (現在は機能的ですがバグがあります)。
私の希望は、視聴者が特定の章内の任意のアンカーにリンクし、アンカー ポイントからアンカー ポイントに前後に移動できることです (上のページから最後のアンカー ポイントへ、または下のページから次のアンカー ポイントへ)。そのため、コードが依存しないことが重要です。特にモバイルプラットフォームではアンカーコードへのスクロールジャンプがトリガーされないためです。
例の章へのリンクは次のとおりです。
http://www.attilathe.com/chapter-5.html
JSFiddle は、コンテンツのトップ レベル フレーム構成やウィジェット プラグインの動作を複製しないため、コードを複製する方法がわかりません。
この未回答のスタックオーバーフローの質問も見ました: アンカー名を知らなくても、リンクをページの次のアンカーに移動するにはどうすればよいですか?
- 関連性があると感じましたが、コードがコンテンツに対して正しく配置され、マスターフレームが考慮されるように、Adobe Muse にコードを効果的に追加する方法を翻訳する助けが必要です。
あなたの洞察を前もってありがとうございました!
リクエストごとに追加を編集 -
以下は、ここの制限に合わせて大量のコードを削除しなければならなかったコードの一部です。誤ってコードを壊してしまった可能性があるため、リンクのソース コードを参照してください。例の章では、ボタンが機能しなかったため配置されていませんが、意図したボタンが配置されるマスター フレーム レイヤー内の他の機能を既に完了しているボタンが含まれています。
angularjs - Angular $anchorScroll ID が URL に残り、更新後に機能しない
公式ドキュメントの例に従って$anchorScroll
、angular に問題があります。をクリックした後、場所のに追加されます - 、最初のロードでは正常に動作しますが、ページがの最後に留まり、スクロールが機能しません。これを修正する方法についてのアイデアはありますか? 私のコード: HTML:gotoBottom
goToBottm
$anchorScroll
url
ID
mysite.com/tag/##ID
refershing
ID
url
そしてID:
私のgotoBottom controller
:
jquery - Wordpress/jQuery: スクロール時に div がビューポートにあるときに一致するアンカーを強調表示する
私は現在、次の基準でWordpress Webサイトのメニューを実装しようとしています:
- ユーザーがページを下にスクロールし、アンカーされた div (メニューにリンクされている) に到達すると、メニュー内のリンクはクラス "active" を取得する必要があります。
- ユーザーが anchor をクリックすると、ページはアンカーされた div までスクロールし、リンクは「アクティブ」クラスを受け取る必要があります。
そのページの HTML は次のとおりです。
次のコードはほとんど機能しますが、次のエラーがスローされます。
Uncaught Error: Syntax error, unrecognized expression: http://domain.com/not-the-current-page
ロジックは次のとおりです。
- スクロールをリッスンし、それに応じて「アクティブ」クラスを追加します。
- リンクがクリックされたら、停止し (1.)、アンカーまでスクロールし、クラス「アクティブ」を追加してから再開します (1.)。
これは、jQuery を使用した最初の作業です。これを正しく機能させる方法について、誰かが私を正しい方向に向けてくれることを願っています。あなたの助けは大歓迎です!
html - アンカスクロールはng-repeatを使用してコントローラで実行されませんか?
ng-repeat の実行のタイミングに関するいくつかの奇妙な AngularJS1 の動作を特定したと思います。したがって、コントローラーの実行のタイミングと競合します。
私のコントローラーは自動的に html アンカー ID までスクロールします: $anchorScroll('html_id');
これは、静的 html ( static html plunker )で問題なく動作します。
ただし、ng-repeat ( ng-repeat plunker )によって生成された div でコントローラーによって呼び出された場合、anchorScroll は機能しないようです。
注:: ng-repeat の anchorScroll はボタンで正常に動作しますが、読み込み時に自動的にスクロールしたい...
(ng-init= を使用してスクロール関数を呼び出すことも試みましたが、同じタイミングの問題です。そのため、アンカーを見つけることができません... ng-repeat の後にコード化されていても)
アイデア/回避策はありますか?
(バインドする ng-repeat イベントはないようです...)