質問

現在、サービスの名前が複数あるシンプルなメニューを作成しており、ユーザーは1つをクリックできます。JQueryは、その下に説明する対応する段落を表示します。私のjQueryコードは問題ありませんが、私が望むものを正確に行いますが、まだアイロンをかけていないバグが1つあります。

これらの見出しのいずれかをクリックして説明ディスプレイが表示されるたびに、ページのラッパーのすべてがFirefoxで約7ピクセルの左にシフトしますが、同じことがGoogle Chromeですが、Amoutを測定していませんが、無関係。

とにかく、私は隠されたパラグラフを表示するためにSlidetoggle()コマンドを使用しています。滑り落ちが発生すると、すべての幅と「マージン:0オート」を何らかの形で変えているため、これが起こっていると思います。私のCSSのラッパールールの設定は、この変更を補うことです。誰かが私がこの問題を改善できる方法を持っていますか?私はインターネットの周りで見つけた他のいくつかの修正を試しましたが、役に立たなかった。

これが私のコードのように見えるものです。私はそれをjsfiddleに置いて、それを簡単に表示できるようにします。 http://jsfiddle.net/vch7m/ 必要に応じてそこで編集するか、ここで修正する必要があるものを投稿してください。もっと便利なものは何でも。助けてくれてありがとう!

役に立ちましたか?

解決

このシフトは、垂直スクロールバーによって引き起こされる可能性があります。ページが大きくなりすぎると、垂直のスクロールバーが表示され、段落の幅がもう少し左に押します。ブラウザビューポートを約1000x600に縮小すると、指定されたJSFiddleページの最初の段落でこれを見ることができます。

これを修正するには、固定された垂直スクロールバーを配置することを検討できます。

html {
    overflow-y: scroll;
}
ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top