0

すべてのスーパーフィッシュ メニュー リンクをインラインで表示したいのですが、サブメニューのスーパーフィッシュが試したすべてのスタイリングを上書きし、常にドロップダウンを表示するという問題があります。

700 px 未満のデバイスでブラウジングしているときに、マウス ホバー時にスーパーフィッシュのアニメーション ドロップダウンを無効にし、スーパーフィッシュ メニュー要素、サブメニュー、およびサブメニュー要素のすべての要素をインライン ブロックで表示する方法を知っている人なら誰でも知っています。

ウェブサイトからの現在のコードはあまりにも乱雑なので、ここにアップロードしましたhttp://pastebin.com/mwPjVEPX これはサイトから直接です。

最初の ul li 要素に display:inline-block を追加しましたが、それは機能しますが、サブメニュー要素では、スーパーフィッシュからの最初の JavaScript が要素スタイル display:none と visibility:hidden を追加し、display:inline-block を追加してオーバーライドしようとすると、最初にホバーすると、何も表示されなくなりました。

そして、ここにスーパーフィッシュメニューのCSSがありますhttp://pastebin.com/vmYkGVx4

4

3 に答える 3

0

CSSにかかわらず、SuperfishJavaScriptは引き続き小さな画面サイズで実行されます。JavaScriptは、CSSプロパティstyleを変更するためにインライン属性を付加することにより、物事を隠したり明らかにしたりします。インラインスタイルは、次のようなキーワードdisplayを追加しない限り、常に他のソースからのCSSよりも優先されます。それは試す価値があります。ただし、JavaScriptは引き続き要素に作用しようとしているため、他の奇妙な動作が発生する可能性があります。行き方を教えてください。!importantdisplay: inline-block !important

于 2013-03-08T10:18:19.427 に答える
0

まず第一に、ここでコードやリンクについて具体的に言及していませんでした。しかし、私が推測するように、親に指定したすべてのプロパティは、自動的にその子要素に追加されます。したがって、与えるdisplay: inline;と、そのすべての子がそれを取得し、インラインであるかのように動作します。だから行ったほうがいいdisplay: inline-block;。この場合、この要素はインライン要素として動作しますが、それ自体はブロック レベル要素として表示されます。そして、子はインラインになりません。

于 2013-03-07T16:48:32.523 に答える
0

結局、私は mobilemenu を使用することになりました。選択した幅でスーパーフィッシュ メニューを非表示にし、ドロップダウン選択ボックスを表示するのは JavaScript コードです。すべての検索から、使用するのが最も合理的です。タッチデバイスをサポートするためのスーパーフィッシュメニューの開発がいくつかありますが、「レスポンシブデザイン」ではまだサポートされていませんが、このアドオンを使用するまで、次のステップはレスポンシブにすることであると話しているさまざまなブログの投稿があります https://github. com/mattkersley/Responsive-Menu

于 2013-03-09T12:34:17.043 に答える