問題タブ [skrollr]
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.
html - ウィンドウのサイズを変更しない限り、Skrollr は終了キーフレームのみを表示します
デザイナーなのでJavaScriptはよくわかりません。
相対モードの 2 つのアニメーションがあります。最初に表示すると、開始キーフレーム (スクロールのその時点) にあるはずなのに、最後のキーフレームに表示されます。何らかの方法でブラウザ ウィンドウのサイズを変更すると、正しい動作が想定され、本来あるべき開始キーフレームに戻ります。ただし、ページを再度更新すると、常に最後のキーフレームに読み込まれるため、ビューポートのサイズまたはスクロール位置が間違っていると思われます。
サイトはこちら: http://vostrocity.dreamhosters.com/#skills
たとえば、次の例では、ウィンドウのサイズを変更しない限り、最後のキーフレームのみが表示されます。
ブラウザー ウィンドウのサイズを変更しなくても正常に動作する絶対モードのアニメーションが 1 つあります。
css - モバイル デバイスでウェブサイトがスクロールしない
このサイトはモバイルではスクロールしません。以前にこの問題を見たことがありますが、これは通常の容疑者ではないようです。私はアイデアがありません。
jquery - jQuery経由でskrollrで使用する属性をアタッチしようとしています
jQuery を使用して skrollr で使用する属性を設定しようとしていますが、うまくいきません。
html:
jQuery:
これは機能していないようです..しかし、理由について100%確信が持てませんか?
javascript - Skrollr テキストのフェードアウト
skrollr を使用してテキストをフェードインおよびフェードアウトしようとしています。以下はコードスニペットです
CSSは以下の通り
フェードインとフェードアウトは期待どおりに機能しています。しかし、テキストは中央に配置されていません。これを達成するためにデータ属性で Position を使用する必要がありますか、それともどこで間違っているのでしょうか。
parallax - Skrollr - 相対 div の視差背景がビューポートの途中で停止する
skrollr を使用して非常に単純な視差レイアウトを構築する方法を理解するために、半ダースのチュートリアルと数日を試したに違いありません。
背景画像を含む 3 つの div があり、それぞれがページの下の異なる位置にあります。それぞれに、ページ レイアウトではなく、ビューポート内の位置に相対的な背景スクロールが必要です。
相対モードを指定する方法と、ビューポートに表示されている間、背景画像をスクロールする方法を理解することはできません。ビューポートのロールアップが完了する前に、スクロールを停止します。
私のデモページはこちら: http://3fishbeta.co.uk/build/040-skrollr/05-skrollr-positioning
ページの最初のイメージ コンテナは次のとおりです。
data-top または data-bottom の設定がわかりません。コンテナがビューポートを離れるまで画像はスクロールし続けますが、早期に停止します。
つまり、コンテナの上部がビューポートの上部に到達すると、画像の動きが止まります...代わりにコンテナの下部にあるはずです...と思います。
誰でも助けてくれますか??!