iotcat
/
hexo-theme-volantis
mirror of https://github.com/IoTcat/hexo-theme-volantis.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

修复导航栏定位条问题

Browse Source
i18n
xaoxuu 6 years ago
parent 9ef3e10af9
commit 2bb1b897d3
3 changed files with 32 additions and 70 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 12
      layout/_partial/header.ejs
  2. 60
      source/js/app.js
  3. 30
      source/less/_header.less

12
layout/_partial/header.ejs
Unescape View File

@ -7,15 +7,15 @@
<% if (config.nav_menu) { %>
<% (config.nav_menu || []).forEach(function(value){ %>
<li>
<a id="<%= is_current(value.url) ? 'is_current' : 'not_current' %>"
class="nav<%= is_current(value.url) ? ' current2 ' : ' ' %>flat-box" href="<%= url_for(value.url) %>">
<a id="<%= url_for(value.url).replace(/\//g, "") %>"
class="nav flat-box" href="<%= url_for(value.url) %>">
<i class='<%=value.icon%> fa-fw'></i>&nbsp;<%=value.name%>
</a>
</li>
<%})%>
<% } %>
</ul>
<div class='underline'></div>
</div>
<% if (theme.search.enable === true) { %>
@ -45,12 +45,13 @@
</div>
</header>
<aside class="menu-phone">
<nav>
<header>
<nav class="menu">
<ul>
<% if (config.nav_menu) { %>
<% (config.nav_menu || []).forEach(function(value){ %>
<li>
<a class="nav <%- page.path.replace('index.html', '').replace("/", "") == value.url.replace("/", "") ? 'current' : '' %> flat-box" href="<%= url_for(value.url) %>">
<a id="<%= url_for(value.url).replace(/\//g, "") %>" class="nav flat-box" href="<%= url_for(value.url) %>">
<i class='<%=value.icon%> fa-fw'></i>&nbsp;<%=value.name%>
</a>
</li>
@ -58,4 +59,5 @@
<% } %>
</ul>
</nav>
</header>
</aside>

60
source/js/app.js
Unescape View File

@ -46,47 +46,23 @@ var customSearch;
}
// function setHeaderMenu() {
// var $headerMenu = $('header .menu');
// var $underline = $headerMenu.find('.underline');
// function setUnderline($item, transition) {
// $item = $item || $headerMenu.find('li a.active');//get instant
// transition = transition === undefined ? true : !!transition;
// if (!transition) $underline.addClass('disable-trans');
// if ($item && $item.length) {
// $item.addClass('active').siblings().removeClass('active');
// $underline.css({
// left: $item.position().left,
// width: $item.innerWidth()
// });
// } else {
// $underline.css({
// left: 0,
// width: 0
// });
// }
// if (!transition) {
// setTimeout(function () { $underline.removeClass('disable-trans') }, 0);//get into the queue.
// }
// }
// // $headerMenu.on('mouseenter', 'li', function (e) {
// // setUnderline($(e.currentTarget));
// // });
// // $headerMenu.on('mouseout', function () {
// // setUnderline();
// // });
// //set current active nav
// var $active_link = null;
// if (location.pathname === '/' || location.pathname.startsWith('/page/')) {
// $active_link = $('.nav-home', $headerMenu);
// } else {
// var name = location.pathname.match(/\/(.*?)\//);
// if (name.length > 1) {
// $active_link = $('.nav-' + name[1], $headerMenu);
// }
// }
// setUnderline($active_link, false);
// }
function setHeaderMenu() {
var $headerMenu = $('header .menu');
// var $underline = $headerMenu.find('.underline');
function setUnderline($item, transition) {
$item = $item || $headerMenu.find('li a.active');//get instant
transition = transition === undefined ? true : !!transition;
// if (!transition) $underline.addClass('disable-trans');
if ($item && $item.length) {
$item.addClass('active').siblings().removeClass('active');
}
}
//set current active nav
var $active_link = null;
$active_link = $('#' + location.pathname.replace(/\//g, ""), $headerMenu);
setUnderline($active_link, false);
console.log($active_link);
}
function setHeaderMenuPhone() {
var $switcher = $('.l_header .switcher .s-menu');
@ -214,7 +190,7 @@ var customSearch;
$(function () {
//set header
setHeader();
// setHeaderMenu();
setHeaderMenu();
setHeaderMenuPhone();
setHeaderSearch();
setWaves();

30
source/less/_header.less
Unescape View File

@ -74,15 +74,12 @@
font-size: @fontsize_base;
color: fade(@theme_text_in_header, 70%);
padding: 0 8px;
&.current{
border-bottom: 4px solid fade(@theme_base_card_bg, 80%);
}
&:hover{
color: @theme_text_in_header;
border-bottom: 4px solid @theme_base_card_bg;
background: fade(@theme_base_card_bg, 10%);
}
&.active{
&:active,&.active{
color: @theme_text_in_header;
border-bottom: 4px solid @theme_base_card_bg;
}
@ -90,20 +87,6 @@
@media(max-width: @on_phone){
display:none;
}
// .underline{
// .enable-trans();
// position: absolute;
// background: @theme_text_in_header;
// left: 0;
// bottom: 0;
// width: 0;
// height: 4px;
// border-radius: 4px;
// &:hover{
// height: 8px;
// }
// }
}
.switcher{
display: none;
@ -218,6 +201,7 @@
box-shadow: @boxshadow_card_normal; // 适合白色导航栏背景
.menu{
ul > li > a{
.enable-trans();
color: fade(@theme_base_tint, 70%);
&.current{
border-bottom: 4px solid fade(@theme_base_tint, 80%);
@ -227,10 +211,10 @@
border-bottom: 4px solid @theme_base_tint;
background: fade(@theme_base_tint, 10%);
}
}
.underline{
// background: @theme_base_tint;
background: transparent;
&:active,&.active{
color: @theme_base_tint;
border-bottom: 4px solid @theme_base_tint;
}
}
}
.switcher{
@ -323,7 +307,7 @@
border-left: 4px solid @theme_bg_quote;
background: fade(@theme_bg_quote, 10%);
}
&.current{
&.active{
border-left: 4px solid @theme_bg_quote;
}
}

Write Preview
Loading…
Cancel
Save