レスポンシブメニューIE7以降対応のJQueryプ

質問

レスポンシブメニューIE7以降対応のJQueryプラグインということで紹介されていた下記のFlexnavを実装したのですが、実際はIE7,8は対応していません。
具体的に言いますと、横幅800pxのブレイクポイントに縮めても、表示が切り替わりません。
そのままのメニューが横に小さくなるだけです。
自分で実装したものだけでなく、サンプルサイトをIE7.8で確認しても同じです。
このプラグインをいじってIE7.8にも対応させられるのなら、その方法をご教示いただきたいのですが、他に、「本当に」レスポンシブでIE7.8対応のこういった多階層ドロップダウンメニューのプラグインがあればオススメを教えてください。どうぞ宜しくお願い致します。
ちなみにモダンブラウザやIE9以降は正しく表示が切り替わります。
http://jasonweaver.name/lab/flexiblenavigation/

回答No.2

pringlez · ベストアンサー

FLEXNAVはダメそうですね。プラグインを紹介しているサイトのトップページがそもそも動かないとか、論外だと思います。

Bootstrapは広く使われているのでいいと思います。メニューだけをケチ臭いことを言わず、ページレイアウト全体をレスポンシブWebデザインにしてくれます。

IE7だとわずかに崩れますがほぼ問題なく動きます。IE8以降であれば全く問題ありません。

Bootstrap
http://getbootstrap.com/
Components · Bootstrap
http://getbootstrap.com/components/

お礼

回答ありがとうございます。１番目の回答者の方にもお伝えしたのですが、SlickNavで実装できました。しかしわたしのミスかな？と思うとすっきりしなかったので、ありがとうございました。
Bootstarpはレスポンシブ制作のワイヤーなどにもよく使われているようですね。
12分割されているのがまだ慣れないのですが、覚えれば楽なのだろうなと思います。

ありがとうございました。

回答No.3

ORUKA1951

jqueryではなく、mediaqueryの話だと思うのですが・・
IE,IE8はCSS3のmediaqueryに対応していませんから、javascriptを使用しなければなりません。
　いずれにしてもスマホを含めてブラウザ間の誤差をなくするためには
・strictで作成する。
・標準モードで起動するようDOCTYPEを正しく指定する。
・media=screenに対してはリキッドで製作する。
　・・・mediaquery使わなくても利用できるように
・mediaがhandheld(携帯電話)、print(プリンー)に対しては指定しない。

　ここまでが大原則です。

　そのうえで
<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
　とjavascriptを読みこんだあと、普通にmediaqueryで指定するほうが楽です。

補足

回答有り難うございます。
mediaqueryも、<!--[if lt IE 9]>～..の記述もしているんです。
実際他のプラグインを利用しましたら実装できましたので、やはりプラグインの問題のようです。

回答No.1

神崎 渉瑠（@taloo）

jQuery2.x系を使ったとかいうオチではないですかね？

お礼

違います　笑。
しかし回答ありがとうございます。
結局SlickNavというプラグインに変えましたら、IE７も対応で、メニューの切り替えもできたのですが、原因はFlexnavというプラグインの不具合なのでしょうか。たまにプラグインによってはサイトで紹介されていても、実際実装してみると異なる..という解説も目にするので...。
メニューの実装自体は他のプラグインでできたのですが、こちらが間違っているならFlexnavのIE7対応でも実装できた方がいると思うので、もう少し回答待ちます。

それと、わたしはIE7は実機ではなく、開発者ツールを使っているので、その辺も少し心配です。確認ツールの不備かも、という。