We Keep Coding

Navbar and slider layers difficulty

I'm having difficulty getting a navbar and a slider to work together. The problem is when it is in mobile view. If you click on the menu icon the menu item slide in from the side but the top ones are appearing stacked underneath the slideshow.
Here is a sample of it posted on my domain test page. http://ecfleming.com/test/index.html
I have tried using a z-index in the CSS as well as few other things. I suspect it might be something in the JavaScript, but I can not figure out what. Does anyone have any ideas of what I can try to fix this?

For a quick fix, you can add .cycle-slideshow { z-index:-1 }

Try not to hard code the height value of div id="header"
Fix the mobile view by removing the height 185px.

scrollbar insde one onther scroll bar

Hi to all,
i was making a slider where i want some thing like below image.
more in details vise in a picture
actualy one of my slider slide got a scroll bar .where i want it as when the user first scroll the page first the slider scoller should scroll and then the slider scroller end ,the page scroller should work normaly.
i have no idea how to do it in jquery but seen those kind of effect in many sites.
please help me and thanks in advance

Sticky Navgiation Problems

I was wondering if you could help.
I am currently putting together a site that requires a parallax scroll and sticky navigation.
The navigation must start below image 1 (Blue) and then stick to the top in a fixed format after you've scrolled past image 1(blue).
I have tried many options and at present, I have got the navigation to stick to the top and then reappear once image1 (Blue) has been passed - but it starts at the top.
I have tried some jQuery plugins and they have not worked, could it be the way I have got my script formatted? As some is embedded directly into the page and not an external file?
Here is my link: http://bella-web.co.uk/sticky-nav/
and would love some feedback as to how I am going to get this to work.
Thanks in advance,
Ben.

You should be able to add navigation menu that starts in the middle of the page and sticks when it reaches the top using the jQuery plugin jQuery Waypoints, the plugin doesn't just work out of the box, so please read the docs.

Stellar.js glitch when scrolling upwards

Please have a look at this website. The problem here is, that while scrolling downwards, the script works perfectly fine, but when scrolling upwards, the classes of the sidebar navigation do not change immediately, but only on scrolling a pixel or so further in the upwad direction.
Please help.
EDIT: I've even tried changing the default offset in the waypoint js to -1, but doing that resulted in the reverse; now the same problem occurs during downward scroll.
EDIT 2: SOLVED: Changed the dimensions and top alignment of the slides which covered the screen. Thank you.

I see you are using Waypoints in order to change the nav menu, the main problem is, the menu are changing when the div are exactly on the top of the page, so you might need to set up the div to trigger on a certain range.
Hopefully waypoints has the offset parameter to adjust and dampen this common problem.
$('.thing').waypoint({
offset: 250
});
Here's the documentation: http://imakewebthings.com/jquery-waypoints/#doc-options

Cannot scroll inside mobile page

I've tried multiple things, including taking out the preventDefaults's and implementing a js that would force touch scrolling but it has all failed. What I am trying to do is keep the blue bar at the top of this page fixed and allow the page to scroll. Eventually I want to add a transition that will only affect the scrollable area but currently I have been trying to figure out why this page won't scroll vertically.
Here is the html:
http://jsbin.com/ocijax
Here is the source:
http://jsbin.com/ocijax/edit#javascript,html
Any help would be greatly appreciated. I just have a really bad feeling the solution has been right in front of my face. Thank you!