第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

在自定義 WordPress 主題的頁(yè)面更改時(shí)保持手風(fēng)琴子菜單打開(kāi)

在自定義 WordPress 主題的頁(yè)面更改時(shí)保持手風(fēng)琴子菜單打開(kāi)

PHP
繁華開(kāi)滿天機(jī) 2022-05-27 16:27:32
我有一個(gè)客戶端站點(diǎn),它需要側(cè)菜單像手風(fēng)琴一樣,在單擊父級(jí)后下拉子菜單并在父級(jí)或任何子菜單處于活動(dòng)狀態(tài)時(shí)保持打開(kāi)狀態(tài)。菜單是用 PHP 創(chuàng)建的,其中的按鈕內(nèi)容取自服務(wù)部分。該菜單是自定義主題的一部分,并已插入到多個(gè)頁(yè)面模板中。作為主題的一部分,我想避免更改模板 php 代碼。(不確定主題多久更新一次)我嘗試過(guò) css 和 jQuery,但到目前為止,只設(shè)法在 onclick 后短暫打開(kāi)子菜單,然后在頁(yè)面加載時(shí)消失。您可以在https://www.birchandco.com上看到該網(wǎng)站- 目前有一個(gè)懸停狀態(tài),以便訪問(wèn)者可以導(dǎo)航。一旦使用 onclick 正常工作,這將被刪除。PHP 模板:<div class="home_services">    <?php         $ser= new WP_Query(array(            'post_type'=>'service',            'posts_per_page' => -1,             'orderby' => 'name',            'order' => 'ASC',                                               'meta_query' => array(                array(                    'key' => '_is_ns_featured_post',                    'value' => 'yes',                )            )                                           ));    ?>    <ul class="service_list">        <?php             if($ser->have_posts()) :                while($ser->have_posts())  : $ser->the_post();        ?>        <li class="item">            <a href="<?php the_permalink(); ?>"><?php the_title();?> <i class="fa fa-angle-double-right" aria-hidden="true"></i></a>            <?php if(get_the_terms(get_the_ID() , 'service_category')[0]->term_id) {?>                <ul class="submenu">                    <?php                        $args = array(                            'post_type' =>'service',                                                                                'orderby' => 'name',                            'order' => 'ASC',                                                                                                                   'post__not_in' => array(get_the_ID()),任何幫助將不勝感激。
查看完整描述

3 回答

?
慕無(wú)忌1623718

TA貢獻(xiàn)1744條經(jīng)驗(yàn) 獲得超4個(gè)贊

我設(shè)法制定了一個(gè)解決方案,以在頁(yè)面更改時(shí)保持子菜單打開(kāi)。我刪除了現(xiàn)有菜單的 PHP 代碼并將其替換為


`<?php //echo do_shortcode("[widget id=nav_menu-3]"); ?>` 

這個(gè) [widget id=nav_menu-3] 短代碼是通過(guò)一個(gè)小部件短代碼創(chuàng)建插件創(chuàng)建的。我使用 WordPress 菜單系統(tǒng)來(lái)構(gòu)建菜單,然后通過(guò)導(dǎo)航菜單小部件訪問(wèn)菜單并將其添加到簡(jiǎn)碼部分,以便為小部件創(chuàng)建簡(jiǎn)碼。上面的代碼允許您向 PHP 模板添加短代碼。


這使我能夠?qū)?WordPress 菜單添加到自定義頁(yè)面模板中。下一步是設(shè)置菜單樣式,使其看起來(lái)像原始菜單,然后通過(guò) CSS 定位當(dāng)前菜單項(xiàng)、父菜單和子菜單,以便在頁(yè)面更改時(shí)子菜單保持打開(kāi)狀態(tài)。請(qǐng)參閱下面的代碼


`/*--- show or hide sub navs based on the parent menu item or the current menu item

----------------------------------------------- */


.widget_nav_menu ul li.current-menu-item ul.sub-menu {display:block;}

.widget_nav_menu ul li.current-menu-item ul.sub-menu li ul.sub-menu 

{display:none;}


.widget_nav_menu ul li.current-menu-parent ul.sub-menu {display:block;}

.widget_nav_menu ul li.current-menu-parent ul.sub-menu li ul.sub-menu 

{display:none;}

.widget_nav_menu ul li.current-menu-parent ul.sub-menu li.current-menu-item 

ul.sub-menu {display:block;}


.widget_nav_menu ul li.current-menu-parent ul.sub-menu li.current-menu-item 

ul.sub-menu {display:block;}

.widget_nav_menu ul li.current-menu-parent ul.sub-menu li.current-menu-item 

ul.sub-menu li ul.sub-menu {display:none;}`

之后,我向父級(jí)添加了一個(gè)偽元素(雙箭頭)以指示有子菜單。


`/*Sub-Menus Pseudo Element - Add to Customise Header

--------------------------------------------- */


ul#menu-services.menu li a:after {

    content: '?';

    font-size: 31px;

    float: right;

  transform: rotate(90deg); -- Turns arrows around so point downwards.

}`


查看完整回答
反對(duì) 回復(fù) 2022-05-27
?
鴻蒙傳說(shuō)

TA貢獻(xiàn)1865條經(jīng)驗(yàn) 獲得超7個(gè)贊

在頁(yè)面加載時(shí),測(cè)試 URL 是否包含您的手風(fēng)琴鏈接到的路徑之一。如果是這樣,打開(kāi)那個(gè)手風(fēng)琴。像這樣的東西:



(function($) {


  $(document).ready(function() {


    // Get the current path (for instance, "/service/contesting-a-will-2/")

    var pathName = window.location.pathname;


    // This is a bit complex, but we're concatenating the pathName variable

    // into your selector so we can find a match and toggle the "open" class

    $('.home_services ul.service_list li a[href*="' + pathName + '"]').toggleClass('open');

  });


})(jQuery);

請(qǐng)注意,我沒(méi)有對(duì)此進(jìn)行測(cè)試,但總體思路只是href將手風(fēng)琴的屬性與pathname我們從 URL 中創(chuàng)建的變量匹配,然后打開(kāi)該手風(fēng)琴項(xiàng)目。添加[href*=...意味著“選擇所有包含的標(biāo)簽”,然后我們傳入我們從中獲得的路徑window.location.pathname。


在所有條件相同的情況下,這應(yīng)該在頁(yè)面完成加載時(shí)打開(kāi)手風(fēng)琴,這基本上實(shí)現(xiàn)了在頁(yè)面加載時(shí)“打開(kāi)”的目標(biāo)。


查看完整回答
反對(duì) 回復(fù) 2022-05-27
?
白衣染霜花

TA貢獻(xiàn)1796條經(jīng)驗(yàn) 獲得超10個(gè)贊

不回答你的問(wèn)題。但是試試


<div class="container">

  <div class="panel-group" id="accordionMenu" role="tablist" aria-multiselectable="true">

    <div class="panel panel-default">

      <div class="panel-heading" role="tab" id="headingOne">

        <h4 class="panel-title">

        <a role="button" data-toggle="collapse" data-parent="#accordionMenu" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">

          Menu 0

        </a>

      </h4>

      </div>

      <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">

        <div class="panel-body">

          <ul class="nav">

            <li><a href="#">item 1</a></li>

            <li><a href="#">item 2</a></li>

            <li><a href="#">item 3</a></li>

          </ul>

        </div>

      </div>

    </div>

    <div class="panel panel-default">

      <div class="panel-heading" role="tab" id="headingTwo">

        <h4 class="panel-title">

        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordionMenu" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">

          Menu 1

        </a>

      </h4>

      </div>

      <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">

        <div class="panel-body">

          <ul class="nav">

            <li><a href="#">item 1</a></li>

            <li><a href="#">item 2</a></li>

            <li><a href="#">item 3</a></li>

            <li><a href="#">item 4</a></li>

          </ul>

        </div>

      </div>

    </div>

    <div class="panel panel-default">

      <div class="panel-heading" role="tab" id="headingThree">

        <h4 class="panel-title">

        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordionMenu" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">

          Menu 2

        </a>

      </h4>

      </div>

      <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">

        <div class="panel-body">

          <ul class="nav">

            <li><a href="#">item 1</a></li>

            <li><a href="#">item 2</a></li>

            <li><a href="#">item 3</a></li>

            <li><a href="#">item 4</a></li>

          </ul>

        </div>

      </div>

    </div>



    <div class="panel panel-default">

      <div class="panel-heading" role="tab" id="headingFour">

        <h4 class="panel-title">

        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordionMenu" href="#collapseFour" aria-expanded="false" aria-controls="collapseFour">

          Menu 3

        </a>

      </h4>

      </div>

      <div id="collapseFour" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFour">

        <div class="panel-body">

          <ul class="nav">

            <li><a href="#">item 1</a></li>

            <li><a href="#">item 2</a></li>

          </ul>

        </div>

      </div>

    </div>


  </div>

</div>



查看完整回答
反對(duì) 回復(fù) 2022-05-27
  • 3 回答
  • 0 關(guān)注
  • 238 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)