Files
tripwithbonus/templates/blocks/n_header.html

80 lines
2.6 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% load i18n %}
{% load base_tags_extra %}
{% load webpush_notifications %}
</div>
<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');
console.log('dfsdfdsfsdfsdfsdfsfsfsfsdfsdf')
var header = $('.header');
$(window).off('scroll.header').on('scroll.header', function() {
var scrollTop = $document.scrollTop();
var headerHeight = header.outerHeight();
var headerHeightTop = headerTop.outerHeight();
var top = headerHeight - headerHeightTop - 20;
if (scrollTop > headerHeight) {
console.log(scrollTop, top)
headerTop.addClass(activeClassname);
$(document.body).addClass(activeClassname);
} else {
headerTop.removeClass(activeClassname);
$(document.body).removeClass(activeClassname);
}
});
}
$(document).ready(()=>{
initHeaderState();
})
console.log($,'sdsdads')
</script>