問題タブ [fixed]
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.
jquery - スクロール中にウィンドウの上部にヘッダーを貼り付けて置き換える
私が取り組んでいるプロジェクトでは、写真を含む多数の div があり、それぞれに写真の YYYY/MM/DD をリストするラベルが付いています。
私が達成しようとしている機能は、現在の div のラベルをウィンドウの上部に固定してスクロールすることで、どの写真を見ているかがわかるようにすることです。写真の次の div がスクロールされると、このラベルがウィンドウの上部に到達したときにスタックしたラベルに置き換わります。
1) ラベルがウィンドウの上部にあることを検出する効率的な方法を見つけるのに苦労しています。すべてのラベルを調べるのはやり過ぎのように思えるので、次のことは好きではありません (「stuckToTop」クラスはラベルに固定位置を追加します)。
私も試しました:
よりエレガントなアプローチに関する提案はありますか?
2)ページが上にスクロールされているときに、新しいラベルが以前に貼り付けられたラベルを上に押し上げることも望んでいます。Picasa のフォト ギャラリーをスクロールしているときに、新しいセクション ラベルが前のセクション ラベルを押しのけるので、これと同じ効果が見られます。
これは、新しいラベルが上に向かってスクロールされるたびに、stuckToTop ラベルの位置を上に調整し、最終的にそれを置き換える必要があることを意味していると思いますか?
ありがとう!
html - テーブル セル内のスクロール可能な DIV
私の答えは古典的ですが、ここでもグーグルを使用しても、適切な解決策を見つけることができません。テーブルを使用してレイアウトを作成しようとしています。table#layout
画面の 100% (それ以上ではない) で#content-td
、スクロールしたいです。私のソリューションは FF/Chrome/Safari では問題なく動作しますが、IE ではいくつかの問題があります。IEが高さをテーブルの高さと同じに設定する場合(私が持っているので間違ってい#content-td
ます)。IEから削除すると、この販売が崩壊します。divの高さを修正するためのjavascriptなしの解決策はありますか?height=100%
#header
height=100%
#content-td
doctype がなくても問題なく動作しますが、有効なドキュメントが必要です。こちらがテストページです。
css - IE、FF、Chromeと互換性のある固定位置のdivを作成する方法
左側に固定(位置)しました。style = "overflow:auto"があり、残りの記事はスクロール可能な右側に移動します。
サイドナビの一部のオプションは、IEおよびFFでは表示されません。ブラウザのビューポートはブラウザによって異なることを理解しています。すべてのオプションが表示されるようにsidenavの高さを調整するにはどうすればよいですか。
助けていただければ幸いです。
ありがとう。
jquery - jqueryは上からピクセル数までスクロールし、次にスクロールの残りの部分で上から固定されるようにdivを設定します
ページの特定のポイント、ページの上部から特定のピクセル数までスクロールしたときに、divのcssを変更しようとしています。
ページの読み込み時に、divを静的に配置します。ページを下にスクロールし始めて、上からポイントに到達したら(たとえば、デモの目的で100px)、静的divを上から20pxのように固定するように変更します。これは、jqueryのcss()プロパティを介して行われます。これにより、ページのずっと下の固定された20pxにとどまることができます。
その100pxのマークに達したときに、どのjqueryプロパティを使用して知ることができますか。誰かが一番上に戻ったら、これも元に戻して、ページが読み込まれたときの位置にdivが戻されるようにし、上から20pxではないようにします。
何か案は?
html - div を中央に配置する必要がありますが、サイド メニュー用のスペースを確保するために特定の左の位置に到達すると停止します
私が見落としているこれには、おそらく簡単な答えがあります。私のコンテンツは、メイン ページの div コンテナーにあります。水平方向に中央揃えにしたいのですが、ブラウザを縮小するとサイドメニューと重なってしまいます。例えば200pxになったら左に動かないようにしたい。
現在、幅の半分 (-350px) の負のマージンを設定し、50% の位置に配置することで中央に配置されています。
私のcssはここにあります
紙 {
}
どんな助けでも大歓迎です
乾杯
jquery - 固定位置の div をコンテンツとともに水平方向にスクロールするにはどうすればよいですか? jQuery の使用
次のCSSでdiv.scroll_fixedを持っています
次の jQuery コードを使用して、div がページの上部に到達したときに .fixed クラスを設定しています。
これは、垂直スクロールの修正に最適です。しかし、ブラウザー ウィンドウが小さい場合、水平スクロールを行うと、この固定 div の右側にあるコンテンツと衝突が発生します。
コンテンツを水平方向にスクロールする div が必要です。
誰かが私を正しい方向に向けることができますか?まだ JS/JQuery に慣れていません。
基本的に、この例の 2 番目のボックスのように機能するようにしたいと考えています。
css - フローティングポジショニングと固定ポジショニングの混合
これがfloatとfixedの標準的な使用法です:
_
- 「littleDiv」divは「bigDiv」divの右側にありますが、スクロールには従いません。
- 反対に、「littleDivFixed」divはスクロールしますが、「bigDiv」divに対して適切に配置されていません(常にディスプレイの左側に固定されています)。
_
2つの動作を混合するdivを持つことは可能ですか?
- 常に「bigDiv」divの右側(10pxの一定距離)、
- 常にディスプレイに表示されます(上から10pxの一定の距離にあります)?
_
よろしくお願いします。
html - 位置決め固定ヘッダー
少なくとも私にとっては、これは難しい問題です。水平方向にスクロールする必要があるページがあります。ページの上部には、ページの中央にずっと同じ場所に留まる必要があるメニューがあります。jQを使用したとしても、同じdivを2つの異なる方法で配置する必要があるように見えるため、これを達成する方法がわかりません。
ここにページがあります:
http://www.coflash.com/testing/raycollins/gall1.php
何らかの理由でスクロールバーも表示されませんが、このサイトの古いコードでは問題なく動作します。
http://www.raycollinsphoto.com
何か案は?
css - div の背景がブラウザーのスクロールバーに重なる問題を修正
今まで見たことのない非常に奇妙な行動。
透明なpng背景画像を持つ固定位置のdivがあります。z-index は -1 に設定されているため、コンテンツはスクロールバーで固定画像をスクロールできます。
下と右の 0px に配置しましたが、画像がスクロールバーと重なっています (FF と Safari ではとにかく)。
リンクは次のとおりです。
http://adamjcas.www59.a2hosting.com/pg/show/id/4
CSS:
私が使用した 1 つのハックは、right: 16px; を使用することでした。
常に(おそらく)右スクロールバーがあるため、これはうまく機能しました。しかし、下のスクロールは時々しかありません。これは単純な CSS の問題ですか?
html - 常に一番上にあるDiv
ページの右側に常に表示される div が必要です。「#サイドバー」と呼んでいます。それは私のページの本文に浮かんでいます。問題は、ページが最大化されていない場合、または一部の小さなモニターでフローティング div がメイン ページ (#container) を移動する場合です。それを解決するためのアイデアはありますか?どうも