В чем проблема вывода подменю при фиксации и скролле?

Question

[Thes]

Всем привет!
Создал меню, прикрутил к нему скрипт, который клонирует его, для удобного фиксирования при скролле. Но проблема только одна: когда скрипт клонирует меню, то перестает отображаться под меню, само меню плавает без ошибок, в консоле тоже нет никаких ошибок.
Либо я где то ошибся с неправильным выводом класса в скрипте, либо еще что то.
Помогите разобраться, не пойму в чем дело.
После клонирования структура меню оборачивается в такой контейнер:

<div id="sticky_header" class="main-sticky">
// основное меню
</div>

но находится выше тега:
<header id="header"></header>
Функция function showMenu() ни в какую не хочет определять класс, чтобы отобразить отобразить подпункты меню.

Вот наглядный пример:
https://codepen.io/pen/VqWYKp

Answer 1

[Doston]

Попробуйте так,
css:

body{height:1000px}.clear:after{clear:both;display:table;content:""}.primary-nav{margin:-1px auto 0px auto;width:96.153846%;z-index:9999}.primary-nav .wrap{background:#000}.primary-nav li{float:left;margin:0;position:relative}.primary-nav li a{color:#dadada;display:block;padding:10px}.primary-nav li ul{background:#ffffff;display:none;left:-1px;list-style:none;margin:0;padding:0;position:absolute;top:100%;width:17em;z-index:10}.primary-nav ul{list-style:none}ul.sub-menu{border:1px solid #ddd}.main-sticky{height:50px;left:0;margin:0 auto;position:fixed;right:0;top:0;-webkit-backface-visibility:hidden;-webkit-transform:translateY(-200%);transform:translateY(-200%);z-index:99999999}.header_is_sticky{-webkit-transform:translateY(0%);transform:translateY(0%)}
		.sticky-active .primary-nav{position: fixed;}

javascript:

$(document).ready(function() {
	var meset = {
		"sticky_header": "1",
		"sho": "200"
	};
	$(".menu-item").hover(function(){
		if($(this).attr("display")!="block"){
			$(this).find(".sub-menu").show();
			$(this).attr("display","block");
		}else{
			$(this).find(".sub-menu").hide();
			$(this).attr("display","none");
		}
	})
	if (meset.sticky_header) {
		var meset = {
			"sticky_header": "1",
			"sho": "200"
		};
		var sticky_header_created = false;

		if ($('#header').length) {

			var sticky_header_top = $('#header').offset().top + parseInt(meset.sho);

			$(window).scroll(function() {
				if ($(window).width() > 480) {
					if ($(window).scrollTop() > sticky_header_top) {
						if (sticky_header_created == false) {
							sticky_header_created = true;
							setTimeout(function() {
								$('body').addClass('sticky-active');
								$('#sticky_header').addClass('header_is_sticky');
							}, 300);
						} else {
							$('body').addClass('sticky-active');
							$('#sticky_header').addClass('header_is_sticky');
						}
					} else {
						$('body').removeClass('sticky-active');
						$('#sticky_header').removeClass('header_is_sticky');
					}
				} else {
					if (sticky_header_created == false) {
						sticky_header_created = true;
					} else {
						$('body').addClass('sticky-active');
						$('#sticky_header').addClass('header_is_sticky');
					}
					setInterval();
				}
			});
		}
	}
});

Comments

[Thes]

спасибо за труд, попробую подпилить плавность вывода подменю
функция showMenu() выводила slideDown подменю