RIPRO主题美化：导航毛玻璃效果

这个效果主要是用在RIPRO主题导航菜单上，目前很多站点都在使用，文字表达不出效果，可参考本站导航查看，本教程以RIPRO父级主题为例，子主题也可参考本教程！

RIPRO主题美化教程：

1.找到RIPRO主题：“ripro/parts/navbar.php”

2.搜索如下代码：

<header class="site-header

3.将这一行代码替换为如下代码：

<header class="site-header frosted navFix" id="navHeight">

5.id后面的吸附不需要的可删除，一般用于菜单上方的黑条，需要的可在：“ripro/footer.php”合适位置添加效果代码：

<script>
//内容信息导航吸顶
    $(function () {
        var navHeight = $("#navHeight").offset().top;
        var navFix = $("#navHeight");
        if (navHeight > 36) {
            navFix.addClass("navFix");
        }
        window.onscroll = function () {
            if ($(this).scrollTop() > navHeight || $(this).scrollTop() > 37) {
                navFix.addClass("navFix");
            } else {
                navFix.removeClass("navFix");
            }
        }
    })
    $(document).ready(function () {

    })
    var ndt = $("#help dt");
    var ndd = $("#help dd");
    ndd.eq(0).show();
    ndt.click(function () {
        ndd.hide();
        $(this).next().show();
    });
</script>

6.如果是没添加后台开关的，直接刷新即可，添加后台开关的到后台打开效果即可！

admin永久会员

收藏 海报 链接