Фиксация Zero block при скролле
Как зафиксировать Zero block сверху
<style>
/* EXAMPLE 1 */
/* id фиксированного блока */
#rec12345678 {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 9998;
}
</style>
Как зафиксировать Zero block снизу
<script>
$("document").ready(function() {
/* #recxxxxxxx — id Зеро блока (меню 1-го уровня, основной) */
var mainMenuBlock = "#rec323041053";
var hoverLeave = $(mainMenuBlock).find(".t396__elem").not($("[href='#menuhover']").parent());
/* #recyyyyyy — id Зеро блока (меню 2-го уровня, который будет всплывать) */
var secondaryMenuBlock = "#rec323251944";
var menuArtboardHover = $(secondaryMenuBlock).find(".t396__artboard");
$("[href='#menuhover']").hover(function(e) {
e.preventDefault();
if(!menuArtboardHover.hasClass("open")) {
menuArtboardHover.addClass("open");
}
});
menuArtboardHover.mouseleave(function(e) {
e.preventDefault();
menuArtboardHover.removeClass("open");
});
$(hoverLeave).mouseenter(function(e) {
e.preventDefault();
menuArtboardHover.removeClass("open");
});
$(window).scroll(function(e) {
menuArtboardHover.removeClass("open");
});
});
</script>
<style>
/* #rec207720047 — id Зеро блока (меню 1-го уровня, основной) */
#rec323041053 {
width: 100%;
position: fixed;
top: 0;
z-index: 998;
}
/* #rec207720048 — id Zero блока (меню 2-го уровня, который будет всплывать) */
#rec323251944 .t396__artboard {
z-index: 997;
position: fixed;
margin: auto;
top: 75px; /* высота Zero блока (меню 1-го уровня, основной) */
left: 0;
transition: all .8s ease;
pointer-events: none;
transform: translateY(-600px); /* сумма высот Zero блоков, которые играют роль меню (1-го и 2-го уровня) */
justify-content: space-around;
box-shadow: 0 9px 9px 0 rgba(0, 0, 0, .09);
}
.open {
pointer-events: all !important;
transform: translateY(0px) !important;
}
</style>