一、把以下样式放到前面：
<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(){start_scrollTop = new_p;},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：你只需要把以上代码放到上面说的那几个位置，然后把里面的链接、文字和图标替换为你自己的就行了。
评论 (0)