1

近々立ち上げる予定のウェブサイトでは、上部のナビゲーション リンクとリストを変更し、ナビゲーション ドロワーに移動するモバイル レイアウトを使用しています。Web サイトに付属のテンプレートと、そのナビゲーションのすべてを制御する js スクリプトが付属しているテンプレートを使用しています。

基本的に、テキストと、タグによって提供される矢印があります。JS コードはその矢印を使用して、ドロワーを次のサブメニューにスライドさせます。コードがどのように機能し、メニューがどのように生成されるか (ショッピング バスケット ソフトウェア MIVA を使用) が原因で、ドロワーにリンクするテキストを取得できません。

そこで私が思いついた解決策は、CSS コードの span クラスで ::after タグを使用してテキストを超えてリンクを展開し、どこをクリックしても次のサブメニューに移動できるようにすることです。これは、最初にナビ ドロワーをスライドさせたときに最初の層のリンクに対して機能しますが、::after タグはすべて、サブ メニューのリストの一番上に移動します。私は position 要素と float 要素をいじってみましたが、すべてのオプションで何も正しく並んでいないようです。

CSS クラスのコードは次のとおりです。

.mobile-navigation ul li span.next::after{
                                    content: "";
                                    position:absolute;
                                    /*padding:50px;*/
                                    left: -200px;
                                    right:0px;
                                    top: 0px;
                                    bottom: 0px;
                                    max-height: 56px;

ここにいくつかの写真があります：http://imgur.com/a/mKYoo

どんな助けでも大歓迎です。

はい、私はウェブサイトのものを隠そうとしています.それはまだ開始されていません.これは開発者のサイトです.

4

1 に答える 1

1

これは非常に古い質問であることは知っていますが、同様の問題の解決策を探しているときに遭遇しました。

.next は、絶対配置 ::after が希望どおりに機能するように、相対的に配置する必要があります。

.mobile-navigation ul li span.next{
    position:relative;
}
于 2016-04-04T17:58:06.563 に答える