絶対配置されたdivのスクロールバーを非表示

Question

div：位置指定されたdiv：私のサイトラッパーの境界の外側に伸びるこのdivは、スライダの背景イメージを含んでいるため、常に表示する必要はありません。問題は、このdivがスクロールバーをトリガするのを止める方法を理解できないことです。私はオーバーフローと位置の異なる組み合わせを試して、それを動作させることはできません。

ファイヤーバグで要素を検査する場合は、スライダの後ろの影の上に配置するだけで問題のdivが表示されます。ブラウザの境界に触れると、スクロールバーが起動します。 View link

誰でも私がシャドウ部門のスクロールバーを停止する方法を教えてもらえますか？

乾杯 ニック

Answer 1

最初に、コメントした人のおかげです。

私は、文書の幅を維持しながらレイアウトを同じに保つソリューションを考え出しました。私がしたことは、100％（ブラウザウィンドウの全幅）の幅を持つメインラッパーの中に＃wrap2を作成することでした。

#wrap2 {background: url(../css_img/slider-bg.png) no-repeat center 317px; } 

このトリックは、画像の位置が中央に設定されていることを確認していました。これは、ブラウザのサイズを変更するときに、イメージがコンテンツに対して相対的なままであることを意味します。私がスライダーの後ろにシャドウラインを作ったのは、左に空白のピクセルを追加することでした。その結果、画像は約1200ピクセル幅になりました。このシャドーパートが正しくプッシュされました。空白のピクセルなので、約1kbしか追加しませんでした。誰かがもっと良い解決策があると思ったら私に知らせてください。

Answer 2

これは、DIVのサイズです。 Chromeを使用して検査すると、コンテナDIVが520ピクセル幅に設定され、問題のあるDIVが733ピクセルに設定されているため、実際には980ピクセル幅の中央領域を超えています。影が消えないようにしない限り、少し左に動かしてdivを左に小さくすることをお勧めします。

body要素にCSS overflow-x：hiddenを使用できます。

jQueryを使用してウィンドウのサイズを検出し、問題のあるdivをウィンドウのサイズに従ってサイズ変更する、もっと複雑な方法があります。