滚动时更改Wordpress菜单

时间:2016-02-29 15:52:50

标签: wordpress menu

有人可以告诉我,滚动时我怎么能有不同的顶级菜单。您可以在此网站http://www.pizzafan.gr上查看示例。它是静态菜单,如果你滚动菜单项正在改变。

1 个答案:

答案 0 :(得分:1)

您需要在header.html中替换一些代码 首先,您需要替换以下代码:

<div class="sticky_logo_left">
        <a href="http://www.pizzafan.gr/el"><img src="/assets/site/images/logo_mobile.png" alt="Pizza Fan Logo" width="140" class="moblogo"></a>
    </div>

自:

<div class="sticky_logo_left">
<a href="http://www.pizzafan.gr/el"><img     src="/assets/site/images/logo_mobile.png" alt="Pizza Fan Logo" width="140" class="moblogo"></a>
<ul class="quick_menu">
            <li class="first desktop">
                <a href="http://www.pizzafan.gr/el">
                    <img src="/assets/site/images/home.png" alt="" class="desktop">
                    <!--<img src="/assets/site/images/home-mobile.png" alt="" class="mobile" height="18">-->
                    <span>Αρχική</span>
                </a>                      
            </li>
            <li class="first">
                <a href="http://www.pizzafan.gr/el/menu/pizzas">
                    <img src="/assets/site/images/slice.png" alt="" class="desktop">
                    <img src="/assets/site/images/slice-mobile.png" alt="" class="mobile" height="18">
                    <span>Menu</span>
                </a>
            </li>
            <li class="first">
                <a href="http://www.pizzafan.gr/el/restaurants">
                    <img src="/assets/site/images/shopping.png" alt="" class="desktop">
                    <img src="/assets/site/images/shopping_mobile.png" alt="" class="mobile" height="18">
                    <span>Καταστήματα</span>
                </a>                      
            </li>
            <li class="hover" data-toggle="modal" data-target="#callBackModal">
                <a href="javascript:void();" class="callmeback">
                    <img src="/assets/site/images/call.png" alt="" class="desktop">
                    <img src="/assets/site/images/call_mobile.png" alt="" class="mobile" height="18">
                    <span>Call Me Back</span>
                </a>
            </li>
        </ul>
    </div>

然后,使用以下颜色代码更改静态菜单图像:#00742D 只需使用上面提到的颜色代码制作菜单图像。

并且您将在滚动菜单中看到相同的菜单项检查此类似的滚动menu example ..菜单都在简单和滚动时使用相同的菜单项/选项。