前提・実現したいこと
ウィンドウ幅280px、ウィンドウの高さはメニューが開いた時にメニューが見切れるくらいの高さ(スクロールバーが有効になる高さ)の時、メニューを開くためメニューボタン(三印のボタン)をクリックした際に画面がチラつくのを防ぎたい。
ここに質問の内容を詳しく書いてください。
まず言い訳なのですが、自分の古いPCでIE6を発掘したので、気まぐれで自分の趣味で作っているホームページをIE6でも見られるようにしようと思い、取り組んでいる事なので、「今時IE6かよ」という突っ込みをいただくとしたらごもっともです。
IE6でウィンドウ幅280ピクセルでウィンドウの高さはメニューが開いた時にメニューが見切れるくらいの高さ(メニューが開いた時にスクロールバーが有効になる高さ)の時、メニューを閉じた状態で少し画面をスクロールさせてメニューボタンを追従させ、そこからメニューボタンをクリックしてメニューを開こうとすると、一応モーダル表示にはなるのですが、メニューが開く過程で画面がチラつきます。
(280ピクセルよりも幅が広い状態についてはまだ半端にしか手を付けられていません。)
このメニューを開く際、画面が一瞬チラつくのを解消する手立てがあれば、ご教示いただけると幸いです。
今はひとまず他のブラウザを無視してIE6でだけ実現できれば良いと考えています。
■■な機能を実装中に以下のエラーメッセージが発生しました。
エラーは出ていません。
発生している問題・エラーメッセージ
モーダルメニューを開く際に画面が一瞬チラつく。
エラーメッセージ
エラーは出ません。
該当のソースコード
すいません、Jqueryだけで文字数オーバーしてしまうため文字数の関係でここに書けませんでした。
以下のURLに現状をアップしております。
これでお付き合いいただけると幸いです。
でもご無理はなさらないでください。そもそもIE6な時点でアレなので・・・。
http://cgi1.plala.or.jp/~tmyk1979/index.html
index.html・・・HTML
style.css・・・CSS
modal-menu.js・・・メニューボタンについてのJquery
試したこと
bodyの高さを切り替える記述を書く位置を変えてみたり、setTimeout()を使ってslideToggleやfadeToggleがきれいに表示されるようなタイミングを探ってみたり、$.when().done(function(){});を使ってbodyの高さが変わってからトグルを行うようにしたり、トグルを行ってからbodyの高さを変えてみたり、、、などやってみたのですが、うまく行きませんでした。
補足情報(FW/ツールのバージョンなど)
InternetExplorer6
SublimeText
ここにより詳細な情報を記載してください。
IE6でもmin-height、min-width、max-height、max-widthを実現するminmax.jsを使っています。
CSS3をIE6にも対応させるselectivizr.jsを使っています。
HTML5をIE6にも対応させるhtml5shiv.jsを使っています。
メディアクエリをIE6にも対応させるcss3-mediaqueries.jsを使っています。
なるべく削ったのですがHTML,CSS,JavaScriptともに長くてすみません。
以下のURLに現状をアップしてあります。
もしこの質問にお付き合いいただける方がいらっしゃいましたらIE6でご覧いただけると、質問内容が伝わりやすいかと思います。
http://cgi1.plala.or.jp/~tmyk1979/index.html
index.html・・・HTML
style.css・・・CSS
modal-menu.js・・・メニューボタンについてのJquery
よろしくお願いします。
回答1件
あなたの回答
tips
プレビュー