問題タブ [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.
ios - 画像が使用されている場合、Skrollr は途切れますか?
skrollr プラグインを使用して、iOS 用の視差 Web ページを作成しています。テキストだけを使用すると、非常に流動的で非常に高速です。CSS で背景画像を含めるか、HTML でインライン画像を含めると、スクロールが突然途切れ途切れになります。これに対する修正はありますか?どんな画像でもかなり遅くなります。
ありがとう!
javascript - Skrollr Body でボディをラッパーしましたが、Skrollr は IOS で動作しません
を使用してWebサイトを開発していSkrollr
v.0.6.17
ます。テスト中に、Web サイトが IOS デバイスで動作しないことがわかりました。Web サイトのページがスクロールできず、ロックできませんでした。Skrollr
固定配置のものを除いて、すべての本体セクションをラップするように実装しました。video embed
それでも機能しませんでしたが、ページをスクロールできることがわかりました。これは奇妙でした。
ウェブサイトはhttp://encore.andrewtaswin.com/です。
これについて誰か助けてもらえますか?ありがとう。
margin - Skrollr: margin-top を変更すると div が上下にフラットになる
Skrollr に問題があります。下にスクロールすると、div (灰色) の位置が左から右に変わります。div (黄色) 内に、別の div があります。親 div がまだその位置を変更している限り、同じ高さにとどまることを望みます。次のように、margin-top を変更してこれを実行しようとしました。
そして、それが起こります。 すべて問題ありませんが、黄色の div が右に移動しながら上下に揺れています。「position:fixed」を使用せずにこれを解決する方法はありますか? 手伝ってくれてありがとう!
編集:ちなみに、iPadでは動作します。
javascript - Safari ios7 で skrollr.js を使用したスクロールの高さのバグ
私は自分が間違っていることを理解しようと頭を悩ませてきました。私は prinzhorn の skrollr.js を使用して、ポートフォリオの再設計でアニメーション効果をスクロールしています。これは、デスクトップや ios7 のクロムでさえもうまく機能します。
しかし... safari ios7にロードすると、スクロールが(ブランドロゴセクションまで)終了し、ページの最後に到達する前に停止します。向きを横向きに変更してから縦向きに戻すと、自動的に修正されます。
また、リロード時にいくつかの奇妙な矛盾に気付きました。少し遠くにスクロールすることもあれば、少し短くスクロールすることもあります。また、スクロールを開始するまで、ページの上部にある初期ロゴ (AP) が消えることがあります。
誰にも考えはありますか?マークアップの間違い?「forceHeight:false」をいじってみましたが、役に立ちませんでした。私は物を取り除いたり動かしたりしてきましたが、それも役に立ちません。「clearfix」クラスも追加しましたが、まだ問題があります。私はそれについてダミーであることを確信しています。どんな洞察も非常に役立ちます。以下のデモリンク:
http://dl.dropboxusercontent.com/u/35202847/portfolio_v7/about.html
svg - SVG 画像をパスに変換 - skrollr で使用
私は最近、効果Skrollr
を達成するための興味深いライブラリに出会いました。parallax
私はいくつかの不透明度を制御するためにそれを使用しており、「パス」を作成するのに理想的です(SVG
デザイナーからの色付けやストローク幅などを含む画像として提供されます)。
ユーザーが下にスクロールするときに、線が引かれているかのように SVG 画像 (パス) をアニメーション化することを望んでいます。これは、予想どおりに同様の効果を使用する skrollr の良い例です。使用例には「パス」がありますが、私が持っているのはsvg
画像です。これには多くのパスがあることに気付きました。Skrollr はインライン SVG パスを必要としているようです。
指定された例と同様の効果を得るにはどうすればよいですか。それを取得するには、指定された svg ファイルを次のようなものに変換する必要があります (例から):-
資力:
javascript - 静止位置から固定位置への切り替え時に点滅
要素の上部がビューポートに当たったときにビューポートの上部にくっつく必要がある要素を含むページがあります。これを実現するために、Skrollr というプラグインを使用しています。私が抱えている問題は、要素がビューポートの上部に達し、そのfixed
中のコンテンツの配置に切り替わると、点滅またはシフトするように見えることです。これは、少し速くスクロールしているときにのみ発生します。ゆっくりスクロールすると、点滅したりシフトしたりしません。
これは、私が見ている問題の例を含む jsfiddle です。Chrome 以外のブラウザはまだテストしていません。
http://jsfiddle.net/dmcgrew/sYV6L/
更新された jsfiddle.. 緑色のブロックがビューポートの上部をわずかに超えて上にスクロールし、その後下にジャンプする様子を見てください。これは、スクロールが速い場合にのみ発生します.. http://jsfiddle.net/dmcgrew/sYV6L/1/
javascript - doctype html を使用すると、iPad で skrollr が機能しない
以下のコードは iPad では機能しません。ページは完全に空白になります。デスクトップブラウザで問題なく動作します。doctype を削除すると、機能します。
奇妙な.. skrollr 0.6.17を使用しています。どうしたの ?
*-カワカマス
html - skrollr と skrollr-menu を使用して、1) ハッシュタグまでサイトをスムーズにスクロールするにはどうすればよいですか? 2) サイトを水平スクロールのみにするにはどうすればよいですか?
これは、私が仕事をすることができない私のフィドルです: http://jsfiddle.net/geoyws/ULJ27/
1) サイトをスムーズにスクロールしてハッシュタグを表示するにはどうすればよいですか? 現在、ちょうどそこに飛んでいます。Skrollr-menu の使用方法に何か問題がありますか?
2) サイトを水平スクロールのみにするにはどうすればよいですか? 私はこの効果を得ようとしています: http://jsfiddle.net/GpPHx/119/
みんなありがとう。
css - スタイルシートのSkrollr定数?
定数を使用しようとしているのはスタイルシートプラグインとの組み合わせですが、何らかの理由で機能しません。私がしたことは次のとおりです。
index.html
skrollr.css
}
定数の代わりに正しい値を使用すると正常に動作しますが、何が間違っていますか?
javascript - Skrollr: スクロール位置が最後のキーフレームの後にある場合に関数を渡す
Skrollr は素晴らしいプラグインで、たくさんのオプションがありますが、スクロール位置が最後のキーフレームの後にあるときに関数を渡す方法があるかどうかはよくわかりません。たとえば、このfiddleを見てください。
上位 100 ピクセルをスクロールすると、scrollable-between
クラスが で変わりますscrollable-after
。同様に、関数を渡したいと思います(例:スクロール位置が最後のキーフレームの後にある場合)。
どうすればそれを達成できますか?