殷德瑶博客
喜欢的歌,静静地听!喜欢的人,远远地看!

Emlog导航栏悬浮显示,div悬浮跟随

殷德瑶 2016-8-22 emlog教程 评论 2161 次

首先在header.php中</head>前插入此段代码,本文以默认模板为例。

<script> $(function () { if ($(".fixed_bar").length > 0) { var offset = $(".fixed_bar").offset(); $(window).scroll(function () { var scrollTop = $(window).scrollTop(); if (offset.top <= scrollTop) $(".fixed_bar").addClass("fixed1"); else $(".fixed_bar").removeClass("fixed1"); });}}); </script>

CSS代码如下:

.fixed_bar{clear:both;}
.fixed_bar img{max-width:100%;}
.fixed1{position:fixed;top:0px;width:960px;z-index: 9999;filter: alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;}

最后打开module.php文件 找到 //blog:导航 中的 <ul class="bar">  并修改为 <ul class="bar fixed_bar">


最后保存文件刷新网页看看效果如何,如果出现错位 自己F12调试CSS吧!


侧边栏添加悬浮也是同样的道理。


发表评论


粤ICP备15078261号 Powered by 黑暗之夜
Theme by 殷德瑶博客