【ニコニコ】自動ローカル保存プロクシ NicoCache 9
いつからなのかわかりませんが、ニコニコ動画のヘッダ追従モードでスタイルに「position: fixed;」が指定されています。
こうすることでヘッダの位置がスクロールに反応しないため、ブラウザの解像度が高いときは便利なのですが……メイン画面が逝っちゃって設定できずorz
ブラウザの表示領域にヘッダが収まらない場合、ヘッダが動かせないためにはみ出した部分の操作が煩わしいです。
ヘッダのモードを未指定の場合、トップページのようなbodyのclassにmode_2（追従）が指定されているページで上記の問題が発生しやすくなります。
この解決策として３つの方法を考えました。
１．header_light.cssに対して「body.mode_2 .bg_headmenu { position: absolute; }」を記述する。
（追従モードを強制的に無効にする）
２．header_light.cssに対して「body.mode_2 .bg_headmenu { overflow-x: auto; }」を記述する。
（ヘッダがはみ出す場合、ヘッダに水平スクロールバーをつける）
３．追従モード時、ページを右にスクロールした量に合わせてヘッダを左にスクロールする。
全て試した結果、３．を採用しました。
ページの横幅を確保するために、header_lightをDOMでコピーして、「.style.position = 'absolute';」と「.style.visibility = 'hidden';」としています。
こうすることで横幅の確保は良い感じなのですが、一意であるはずのid属性までコピーされているはず……。
あと、現状のJavaScriptではonscrollの処理回数が激しそう……。
とりあえず、ファイルを ttp://nicolist.net/nicocache_nl/up/img/nl365.zip にUPしておきました。
自己責任になりますが、必要な方は↑からどうぞ。
私の環境（Internet Explorer 8, Mozilla Firefox 3.5.7, Google Chrome 4）で問題は起きていませんが、JavaScriptの改善をできる方がいれば、チェックや改善をしていただけると助かります。
こうすることでヘッダの位置がスクロールに反応しないため、ブラウザの解像度が高いときは便利なのですが……メイン画面が逝っちゃって設定できずorz
ブラウザの表示領域にヘッダが収まらない場合、ヘッダが動かせないためにはみ出した部分の操作が煩わしいです。
ヘッダのモードを未指定の場合、トップページのようなbodyのclassにmode_2（追従）が指定されているページで上記の問題が発生しやすくなります。
この解決策として３つの方法を考えました。
１．header_light.cssに対して「body.mode_2 .bg_headmenu { position: absolute; }」を記述する。
（追従モードを強制的に無効にする）
２．header_light.cssに対して「body.mode_2 .bg_headmenu { overflow-x: auto; }」を記述する。
（ヘッダがはみ出す場合、ヘッダに水平スクロールバーをつける）
３．追従モード時、ページを右にスクロールした量に合わせてヘッダを左にスクロールする。
全て試した結果、３．を採用しました。
ページの横幅を確保するために、header_lightをDOMでコピーして、「.style.position = 'absolute';」と「.style.visibility = 'hidden';」としています。
こうすることで横幅の確保は良い感じなのですが、一意であるはずのid属性までコピーされているはず……。
あと、現状のJavaScriptではonscrollの処理回数が激しそう……。
とりあえず、ファイルを ttp://nicolist.net/nicocache_nl/up/img/nl365.zip にUPしておきました。
自己責任になりますが、必要な方は↑からどうぞ。
私の環境（Internet Explorer 8, Mozilla Firefox 3.5.7, Google Chrome 4）で問題は起きていませんが、JavaScriptの改善をできる方がいれば、チェックや改善をしていただけると助かります。
|
|
|