new gamburger menu

This commit is contained in:
arlemp@selectel.ru
2021-12-08 12:08:53 +03:00
parent 90f36ea5d6
commit 58f4a5ca8b
5 changed files with 104 additions and 14 deletions

View File

@@ -1,15 +1,36 @@
<header>
<div id="mobile_main_menu">
<?php wp_nav_menu( array(
'container_class' => 'main_main',
'theme_location' => 'top',
'menu_id' => 'gamburer_menu'
) ); ?>
<?php $menu_items = wp_get_nav_menu_items(23);?>
<div id="mobile_main_menu">
<div class="main_main">
<ul id="gamburer_menu" class="menu">
<li id="rubrics_start"><a href="#">Рубрики<span class="rub_arrow">></span></a></li>
<?foreach ($menu_items as $item):?>
<li><a href="<?=$item->url?>"><?=$item->title?></a></li>
<?endforeach?>
</ul>
</div>
<?php /**wp_nav_menu( array(
'container_class' => 'main_main',
'menu' => 'mob_topmenu',
'menu_id' => 'gamburer_menu'
) ); **/?>
<div id="closed_mobile_menu"></div>
</div>
<div id="mobile_rubrics_menu">
<div id='rubrics_back'><strong><</strong> <span class="rub_back_title">назад</span></div>
<?php wp_nav_menu( array(
'menu_class'=>'menu_left',
'theme_location'=>'left'
));?>
<div id="closed_mobile_rubrics_menu"></div>
</div>
<div id="mainlogo">
<a href="<?php echo home_url(); ?>"><img width="240" src = "<?=get_stylesheet_directory_uri()?>/pub/logo/vij_logo.svg" alt = "Ветеринария и жизнь. Газета и сайт" /></a>

View File

@@ -170,7 +170,7 @@
<noscript><div><img src="https://mc.yandex.ru/watch/56480275" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->
<script type='text/javascript' src="<?php echo get_stylesheet_directory_uri()?>/scripts/burger-menu.js?ver=18"></script>
<script type='text/javascript' src="<?php echo get_stylesheet_directory_uri()?>/scripts/burger-menu.js?ver=19"></script>
</body>
</html>

View File

@@ -4,7 +4,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title><?php wp_title('|', true, 'right');?><?=get_bloginfo('name')?></title>
<link rel="stylesheet" href="<?php echo get_stylesheet_uri();?>?ver=84">
<link rel="stylesheet" href="<?php echo get_stylesheet_uri();?>?ver=91">
<link href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel="stylesheet">
<script type='text/javascript' src="<?php echo get_stylesheet_directory_uri()?>/scripts/jquery-3.6.0.min.js"></script>
<script type='text/javascript' src="<?php echo get_stylesheet_directory_uri()?>/scripts/golos.js"></script>

View File

@@ -7,16 +7,36 @@ jQuery(document).ready(function() {
});
var toggle_nav = document.getElementById('toggle-nav');
var rubrics_start = document.getElementById('rubrics_start');
var closed_menu = document.getElementById('closed_mobile_menu');
var mobile_main_menu = document.getElementById('mobile_main_menu');
var toggle_nav = document.getElementById('toggle-nav');
var closed_mobile_rubrics_menu = document.getElementById('closed_mobile_rubrics_menu');
var mobile_rubrics_menu = document.getElementById('mobile_rubrics_menu');
var rubrics_back = document.getElementById('rubrics_back');
closed_menu.onclick = function() {
mobile_main_menu.style.display = 'none';
};
closed_mobile_rubrics_menu.onclick = function() {
mobile_rubrics_menu.style.display = 'none';
};
rubrics_start.onclick = function() {
mobile_rubrics_menu.style.display = 'block';
};
rubrics_back.onclick = function() {
mobile_rubrics_menu.style.display = 'none';
mobile_main_menu.style.display = 'block';
};
toggle_nav.onclick = function() {
mobile_main_menu.style.display = 'block';
};

View File

@@ -1244,7 +1244,19 @@ a{
/*width: 105px;
height: 84px;*/
width: 145px;
}
}
.preview_citata{
/*background:transparent url(/wp-content/themes/vij/pub/icons/citata.png) no-repeat top right;*/
width: 145px;
}
.preview_citata IMG{
width: 145px;
}
.publ_expert{
font-size: 16px;
@@ -1771,6 +1783,8 @@ img-fluid{
}
#mobile_main_menu{
display: none;
position:fixed;
@@ -1779,17 +1793,34 @@ img-fluid{
left:0px;
right:0px;
z-index:100;
min-width: 600px;
width: 100%;
background: #fff;
border-top: 1px solid #F5F5F5;
overflow-y:scroll;
padding-top: 42px;
}
#mobile_rubrics_menu{
display: none;
position:fixed;
top:0px;
bottom:0px;
left:0px;
right:0px;
z-index:100;
width: 100%;
background: #fff;
border-top: 1px solid #F5F5F5;
overflow-y:scroll;
padding-top: 42px;
}
#closed_mobile_menu{
#closed_mobile_menu, #closed_mobile_rubrics_menu{
position: fixed;
cursor: pointer;
z-index: 1;
top: 20px;
right: 5%;
@@ -1798,10 +1829,28 @@ img-fluid{
background: no-repeat url(https://vetandlife.ru/wp-content/themes/vij/pub/menu/closed.svg) left center;
}
#rubrics_back{
margin-left: 38px;
font-size: 14px;
color: #00466A;
line-height: 110%;
cursor: pointer;
}
.rub_arrow{
float: right;
margin-right: 12px;
}
span.rub_back_title{
margin-left: 22px;
}
#gamburer_menu li{
font-weight: bold;
font-size: 11px;
font-size: 13px;
line-height: 19,5px;
text-transform: uppercase;
border-bottom: 1px solid #F5F5F5;
margin-top: 22px;