2016-04-25 9 views
0

divの高さをウィンドウの高さに設定したときに、JS Binのコードを使用してdivの高さを設定するとjQueryで問題が発生しましたが、手動でサイズを小さくしてウィンドウの高さを小さくすると私のブラウザでは、それが途切れると、divの余分な部分が画面から消えてしまいます。jQueryの高さ関数が動作しない

JS Bin ブラウザウィンドウのサイズを変更すると、リスト番号3(など)が画面外に表示されます。私はなぜそれが起こるのかについて私の頭を包むことができない、私は コードをチェックして、私はそれで何か間違って見つけることができませんでしたjQueryバージョンを変更しようとしました。私もそれを書き直しましたが、まだ動作していません。別のフォーラムで検索したところ、jQueryのサイズ変更関数を追加するように言われました。それは私のコードを見たことがないことを私に証明しました。私はすでにその関数を持っているからですが、setHeight関数はウィンドウのサイズ変更時に実行されます。お知らせ下さい。

答えて

1

実際には、あなたが望むものを達成するためのスクリプトは必要ありません。 HERESにのみCSSソリューション - https://jsbin.com/xopamakiru/1/edit?html,css,js,output

はあなたのナビゲーションバーには、あなたは、単にheight: 100%を追加することができ、それは、ビューポートの全体の高さがかかりますので、それは、bodyに対して配置position: fixedです。子供の要素に同じ高さを追加する必要があります。そのため、ナビゲーションバーの高さは100%になります。 3つのli要素(100%/ 3 =〜33.33%)があるので、height: 33.33%を追加すると、それらの高さは同じになります。パーセンテージを使用しているため、ユーザーがウィンドウのサイズを変更すると、要素の高さが自動的にサイズ変更されます。

+0

私は実際のプロジェクトにそれを含めました。しかし、それでもあなたが提供したリンクでは、ブラウザウィンドウのサイズを変更しようとしても、3つのリンクすべてに適合するようにdivのサイズを変更しません。 – msamprz

+0

@msamprz更新の回答 – t1m0n

+0

ああ、それは素晴らしい、ありがとう、働いた。それを説明してもらえますか? – msamprz

関連する問題