找到
4
篇与
xiuno
相关的结果
-
-
-
-
xiuno bbs网站底部添加导航菜单（代码和教程） 一、把以下样式放到前面：<style> .bottom-nav { /* display: none; */ background-color: #fafafa; box-shadow: 0 -1px rgba(0,0,0,0.1), 0 -2px 10px rgba(0,0,0,0.1); } .bottom-nav .opts-group { position: relative; display: inline-block; /* padding-top: 6px; */ line-height: 20px; color: #9e9e9e; cursor: pointer; } .bottom-nav .opts-group.active { color: #da5b62; } @media screen and (min-width: 992px) { .bottom-nav, .header_seach_but { display: none !important; } </style>二、把以下js放到后面：<script type="text/javascript"> $(function() { setTimeout(function() { $.require('https://www.google-analytics.com/ga.js', function() { try { var pageTracker = _gat._getTracker("UA-9784446-1"); pageTracker._trackPageview(); } catch (err) }); }, 1000); setTimeout(function() { $(".bbs_home_page_three_col .small_logo").each(function(index, element) { if ($(element).children("a").length == 0) { $(".bbs_home_page_three_col .bbs_home_page_row_div").eq(index).children('div:first-child').removeClass("col-lg-8").addClass("col-lg-9"); $(".bbs_home_page_three_col .bbs_home_page_row_div").eq(index).children('div:last-child').removeClass("col-lg-4").addClass("col-lg-3"); $(".bbs_home_page_three_col .bbs_home_page_row_div").eq(index).children('div:first-child').children("span").css("width", "19rem"); } }) }, 2000); if (self != top) { $('#header').hide(); $('#nav2').hide(); $('#footer').hide(); } // 导航 var new_p = 0, start_scrollTop = 0; $(window).scroll(function(e){ new_p = $(this).scrollTop(); if(start_scrollTop < new_p) {//下滚 $('.header_fiexd').css("display","none"); } else {//上滚 $('.header_fiexd').css("display","block"); } setTimeout(function(),0); }); // 返回顶部 $(window).scroll(function() { if ($(window).scrollTop() >= 500) { $('.act_go_top').fadeIn(300); } else { $('.act_go_top').fadeOut(300); } }); $('.act_go_top').click(function() { $('html,body').animate({ scrollTop: '0px' }, 100); }); var m1 = 0; // 滚动的值 var m2 = 0; // 对比时间的值 var timer = null; document.onscroll = function() { clearTimeout(timer) // 每次滚动前 清除一次 timer = setTimeout(Data, 2000); m1 = document.documentElement.scrollTop || document.body.scrollTop; } function Data() { m2 = document.documentElement.scrollTop || document.body.scrollTop; if(m2 == m1){ $('.act_go_top').fadeOut(300); } } }); </script>三、把以下代码放到后面： <div class="position-fixed w-100 header_fiexd bottom-nav" style="width: 100%; height: 55px; bottom: 0; z-index: 2; background: #fafafa;"> <div class="row mx-0 text-center align-items-center" style="height: 55px;"> <a href="/" class="col" style="max-width: 20%;"> <div> <i class="icon-home"></i> </div> <div> 首页 </div> </a> <a href="forum-1.htm" class="col" style="max-width: 20%;"> <div> <i class="icon-venus"></i> </div> <div> 女生 </div> </a> <a href="forum-2.htm" class="col" style="max-width: 20%;"> <div> <i class="icon-mars"></i> </div> <div> 男生 </div> </a> <a href="forum-4.htm" class="col" style="max-width: 20%;"> <div> <i class="icon-venus-mars"></i> </div> <div> 聘请 </div> </a> <a href="my-notice.htm" class="col" style="max-width: 20%;"> <div> <i class="icon-user"></i> </div> <div> 我的 </div> </a> </div> </div> 注1：你只需要把以上代码放到上面说的那几个位置，然后把里面的链接、文字和图标替换为你自己的就行了。注2：图标库：http://fontawesome.dashgame.com/#new
