Please refer to project: http://www.lightertaste.com/
If you condense the screen and/or open via media, the responsive menu is not working correctly. I'm using the Responsive Menu Pro Plugin.
1) When the menu appears, the search bar appears over the top of the menu link (I have the menu link set to left and the search box appearing after the menu).
2) The entire menu is linking my FAQ page and I have NO idea why.
3) When you open the menu, it overlaps the top bar (where you open the menu) - you can only see it for a few seconds before it transfers you to the FAQ page.
Any help would be appreciated.
Related
I inherited a website with some new business. The menu works fine on the desktop when viewed at full screen. When the browser is sized down and the navigation links are placed into the hamburger menu, it doesn't work. I'm not sure why it isn't working.
If you inspect the element, the links are there, but the nav bar doesn't expand at all. It's using foundation for the menu. I've read the documentation and I'm still not sure why it isn't working. Any guidance is appreciated.
Here's a link to the site: JordanPlumbing.com
Replace this code in lnm-scripts.min.js
jQuery(function(){if(location.hash!=""){window.location=location.hash.replace("#!","");}
jQuery(document).foundation();jQuery("#preloader").css("width",jQuery(window).width());jQuery("#preloader").css("height",jQuery(document).height());jQuery(".ajax-link").on("click",function(){jQuery(".ajax-link").removeClass("ajax-active");jQuery(this).addClass("ajax-active");});jQuery("ul.children").parent().addClass("page_parent"); jQuery(".slick-background-slider .slick-slide").css("min-width",jQuery(window).width());jQuery("#scrolltoform").click(function(){if(jQuery("#contactForm").length>0){jQuery('html, body').animate({scrollTop:jQuery("#contactForm").offset().top},2000);return false;}else{return true;}});});jQuery(window).load(function(){if(jQuery("#click-on-load").length>0){jQuery("#click-on-load").click();}
jQuery(".color-picker").on("click",function(){jQuery(".color-picker").toggleClass("translate");});});jQuery(window).on("resize load",function(){ if(jQuery(window).width()<=1500){var ratio=2560/1440;jQuery(".slick-desktop").css("min-height",jQuery(window).height());jQuery(".slick-desktop").css("min-width",jQuery(window).height()*ratio);jQuery(".slick-desktop").css("left",-((jQuery(".slick-desktop").width()-jQuery(".slick-background-slider .slick-slide").width())/2));jQuery(".slick-desktop").css("position","relative");}
else{jQuery(".slick-desktop").css("min-height","auto");jQuery(".slick-desktop").css("min-width","100%");jQuery(".slick-desktop").css("left","0");}
if(jQuery(".slider-wrapper").width()>jQuery(window).width()){var overflow=(jQuery(".slider-wrapper").width()-jQuery(window).width());var fixPositioning=overflow/2;jQuery(".slider-wrapper").css("left",-fixPositioning);}});jQuery(window).scroll(function(){jQuery("[class*='animate-from-'").each(function(){var theTop=jQuery(window).scrollTop()+(jQuery(window).height()-(jQuery(window).height()/4));var thisTop=jQuery(this).offset().top;if(theTop-250>thisTop){jQuery(this).delay(500).addClass("complete");}});});
I'm working on a wordpress page and I have a problem with the top navigation menu. If you check my screenshot in the link, you can see a big white area under the top menu, which should not be there. It's as if the top menu extends all the way down there.
Naturally, if I remove the top navigation menu the white spice disappears, confirming this has something to do with that very menu.
I'm not well versed in wordpress. So I don't know exactly what files, code or setting I should check.
Any ideas?
I am currently working on an AngularJS project for a tablet with the basic navigation through all the different pages. The project consists of all the basic features like Side Navigation Menu, a Header, the links of different pages, and a Footer.
The project is also created responsively using Bootstrap. I am not facing any responsiveness issue in all the elements created in the project except one.
When keyboard opens, the responsiveness gets disturbed.
Basically, the header div position gets distorted, the footer shifts above and gets placed right above the keyboard opened, and the side-navigation width also gets disturbed.
I tried the following things -
Used position: fixed, position: relative but nothing changed.
Looked into many different SO question links but got no fruitful result.
I have one option (hack) left that is stated in this SO answer given by Roberrrt but that's a long process and I'm short on time and doubt if it will be a positive hack.
Any help would be hugely appreciated.
Update :-
Giving an idea of how the structure of my project is -
This is the main page where a search box that is in-built in DataTables is used. The Header, Footer and Side-Navigation Burger Menu Button are as described here.
When clicked on the Burger menu, the side-nav opens in full-width as shown below -
Now on clicking the search box the following screen shows with all the elements distorted and responsiveness screwed -
For reference purpose, The theme that I'm working on is Inspinia
After integrating a CSS/xHTML theme into wordpress, the bootstrap responsive menu no longer opens submenus when viewed on a mobile browser: http://d.pr/i/HrBg
Wordpress Theme (submenu not working): http://gtglobalcorp.com
Original CSS/xHTML (submenu working): http://ev.to/coded
Do you happen to know why?
In the mobile menu, all your href attributes are hashtags.
What we have here is either a loop that isn't outputting the right markup or a Wordpress Mobile menu that's different from the Wordpress Default menu.
Without knowing the architecture of the theme, this problem can not be diagnosed further.
I have a site that I am working on in wordpress using parallax scrolling and bootstrap V 2.3.2.
I have two questions regarding the nav menu bar:
Can anyone offer some suggestions on getting the nav bar to stay at the top of the page when I scroll back to the top?
This is related to above question. When I scroll to the top and go back to the "home section"
the second section "Creative Services" is still highlighted even though that is not the active page. I would like to have it return to it's normal (white) state.
Link to my website