[RESOLVED]Responsive Menu in Fixed Header is not working

i am using a template for designing my website. but here one problem came acroos to fixed header. it’s working fine but when came to responsive menu design when we scroll the page the responsive button is not present it’ gone when that time we move to the
top of the page it’s getting i can search for why it’s happening . the responsive menu icon is 

created in body level not in Header section that’s way when we scroll header is present and menu icon is missing so i am trying to append this menu icon to header when scroll the page.   by successfully it’s present in Header sction but it’s not working
when i click on that icon the menu is not coming. i tried with lot of stuff the icon is coming but it not working

if (!$('body').hasClass('one-page')){
		var men = $('.top-nav > ul').html();	
		$('<a href="#" class="menuBtn"><i class="fa fa-bars"></i></a><div class="responsive-nav"></div>').prependTo('body');
		$('.responsive-nav').html('<h3>Menu Navigation</h3><ul>' + men + '</ul>');
	    //$('#ResBTN').appendTo('.top-head');
		$('.menuBtn').click(function (e) {
		    
			e.preventDefault();
			$('.pageWrapper').toggleClass('colBody');
			$('.menuBtn').toggleClass('menuBtn-selected');
			$('.pageWrapper').click(function(){
				$(this).removeClass('colBody');
				$('.menuBtn').removeClass('menuBtn-selected');
			});
		});
	}
if($('.top-head').attr('data-sticky') == "true"){
		$(window).on("scroll",function(){
			var Scrl = $(window).scrollTop();
			if (Scrl > 1) {
			    $('.top-head').addClass('sticky');
			    $('.menuBtn').prependTo('.top-head .container');  // here iam adding again thar icon to header section it's with in the header but it's not slidding the menu
			}
			else {
			    $('.top-head').removeClass('sticky');
			   // ('.menuBtn').remove();
			}
		});

Hi Siva_540,

For your issue ,I suggest that you can use F12 to debug your javascript code check if it has any error message.

Best Regards,

Kevin Shen.

Leave a Reply