74 lines
2.4 KiB
HTML
74 lines
2.4 KiB
HTML
{% load i18n %}
|
||
{% load base_tags_extra %}
|
||
{% load webpush_notifications %}
|
||
|
||
<header class="header">
|
||
<div class="header__grid container">
|
||
<div class="header__logo">
|
||
<a href="{% url 'main' %}">
|
||
<img class="svg" src="/static/img/png/finlogo.png">
|
||
</a>
|
||
</div>
|
||
|
||
|
||
<nav class="header__nav hide__md">
|
||
<ul class="header__list">
|
||
<li class="header__item">
|
||
<a href="#benefits" class="header__link">{% trans "Преимущества" %}</a>
|
||
</li>
|
||
<li class="header__item">
|
||
<a href="#rewiews" class="header__link">{% trans "Отзывы" %}</a>
|
||
</li>
|
||
<li class="header__item">
|
||
<a href="#howtowork" class="header__link">{% trans "Как это работает" %}</a>
|
||
</li>
|
||
<li class="header__item">
|
||
<a href="#about" class="header__link">{% trans "О сервисе" %}</a>
|
||
</li>
|
||
</ul>
|
||
</nav>
|
||
<a
|
||
class="header__btn btn btn--primary hide--md"
|
||
onclick="ym(97070898,'reachGoal','reg_button_header'); return true"
|
||
href="{% url "registration_page" %}">
|
||
{% trans "Регистрируйся" %}
|
||
</a>
|
||
<div class="dropdown show__md">
|
||
<img onclick="showMenu(this, event)" class="dropbtn" src="/static/img/svg/Menu.svg">
|
||
<div
|
||
onblur="hideMenu(event)"
|
||
class="dropdown-content"
|
||
>
|
||
<a href="#benefits" class="header__link">{% trans "Преимущества" %}</a>
|
||
<a href="#rewiews" class="header__link">{% trans "Отзывы" %}</a>
|
||
<a href="#howtowork" class="header__link">{% trans "Как это работает" %}</a>
|
||
<a href="#about" class="header__link">{% trans "О сервисе" %}</a>
|
||
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
<script>
|
||
function initHeaderState() {
|
||
var activeClassname = 'scrolled';
|
||
var $document = $(document);
|
||
var headerTop = $('.header');
|
||
var header = $('.header');
|
||
$(window).off('scroll.header').on('scroll.header', function() {
|
||
var scrollTop = $document.scrollTop();
|
||
var headerHeight = header.outerHeight();
|
||
if (scrollTop > headerHeight) {
|
||
headerTop.addClass(activeClassname);
|
||
$(document.body).addClass(activeClassname);
|
||
} else {
|
||
headerTop.removeClass(activeClassname);
|
||
$(document.body).removeClass(activeClassname);
|
||
}
|
||
});
|
||
}
|
||
|
||
$(document).ready(()=>{
|
||
initHeaderState();
|
||
})
|
||
</script> |