問題タブ [background-attachment]
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 - ラッパー div に固定されたバックグラウンド アタッチメント
私はそのような状況を持っています: http://jsfiddle.net/5axmtw9g/3/
フィドルでわかるように、固定背景画像はラッパーではなくウィンドウに配置されています。期待どおり、画像を「content-middle」divの先頭に配置したいと思います。background-size:cover でソリューションを使用しても、画像のストレッチを避ける必要があるため、うまくいきません。私はこれに積み重なって、実用的な解決策を見つけることができないので、助けてくれて本当に感謝しています. よろしくお願いします。ここにコードを入力してください
jquery - background-attachment:chrome の滑らかなスライダーで動作しない問題を修正
jquery slick スライダーを作成しました。私が欲しいbackground-attachment:fixed。moz、IEでは正常に動作していますが、google chromeでは動作していません。
フィドルのデモを見つけてください
HTML:
CSS:
JS:
html - Fixed to window, but contained inside container
I have some HTML set up like this:
The cover element is uses background-attachment: fixed; to create a parallax effect. What I'm trying to achieve is have the overlay element behave the same way, where the text in it is fixed to the viewport, but still contained inside the mediasection div, so that when the user scrolls the page the cover and overlay stay in the same position, but disappear as the mediasection element goes out of view.
Is there any way to achieve this?
tl;dr; Some sort of background-attachment: fixed; to regular elements, not just the background.
Thanks!
android - Android でのびくびくした動作
サイトのセクションの背景画像で全幅と全高を使用していますが、Android で動作が不安定です。modernizr を使用して touchevents を検出し、background-attachment を固定からローカルに変更しています。これがサイトで、以下は私が使用しているcssです。
html - CSS: background-attachment: fixed および border-radius
背景画像が大きいウェブサイトがあります。ここで、背景画像もある円のボタン/リンクを追加したいと考えています。
Chrome と IE では正常にレンダリングされますが、Firefox では と同じ醜いボックスが表示されbackground-colorます<body>。
外側の容器と丸ボタンを組み合わせる とすぐに問題が発生するようです。background-attachment: fixed;border-radius
これは Firefox のバグだと思います。誰にもこれに対する回避策がありますか？
PS: ここで「コード スニペットの実行」を介して実行すると、Firefox で正しくレンダリングされます。何故ですか？！
Chrome/IE (どちらの丸も正しい):
Firefox (ピンク色のボックスにある 2 番目の円background-attachment: fixed;が壊れています):
html - CSS - いくつかのスクロール位置に白いストリップが表示される背景添付ファイルを修正
に設定された背景を持つヘッダーがありますが、background-attachment: fixed;これにより、特定のスクロール位置でページの上部に白いストリップが表示されます (背景がぼやけているため、ストリップもぼやけていますが、まだ表示されています) .
これが現在の外観です。上部に白い輝きのようなものがあり、それは私が話しているストリップです
私が今持っているコードはこれです (スニペットを実行する場合は、まだモバイル対応にしていないため、フルスクリーンで表示してください): Codepenで編集
ストリップを表示するには、画面に小さなヘッダーのみが表示されるまで下にスクロールします。
background-attachment: fixed;に変更するとストリップが外れますがbackground-attachment: scroll;、固定したままにしておきたいです。
何かを見落としているように感じますが、これを引き起こしている可能性のあるものは何も考えられないので、この問題の原因は何ですか?どうすれば修正できますか?
html - トップナビゲーションバーとスクロールで背景を修正
妹の誕生日にニセ会社のホームページを作っているのですが、固定背景でちょっと困っています。シンプルで添付ファイルの問題であることはわかっていますが、何らかの理由で機能していないようです。理由は明らかに私ですが、これで私を助けてくれると思いました:)
ここにウェブサイトがあります: http://camilleperrin.fr/BBE/で、スクロールする必要があるときに問題が発生します (解像度が 1920x1080 の場合、このページ: http://camilleperrin.fr/BBE/index.php?ページ = キャリア)。巨大な画面を使用していて問題が見られない場合、背景画像が本来あるべき場所に留まらず、スクロールとともに下に移動します。
これが私のコードです（私はインターネットに助けられました。私はこれらすべてを自分で思いついたわけではありません）：
CSS :
HTML :
ぼやけたテキスト コンテナーを保持したまま、これを修正する方法について何か考えがあれば、非常に役に立ちます。
ありがとうございました！
カミール