How do I incorporate the following sidebar menu feature using jQuery where the menu on the left re-appears as the user scrolls down the page?
Here's an example sidebar menu.
There's a really good tutorial over at Nettuts about this exact thing:
Creating a Floating HTML Menu Using jQuery and CSS
Jquery CSS Control:
http://css-tricks.com/scrollfollow-sidebar/
and tutorial is also nice,
if you are using bootstrap then you can use affix control of bootstrap, that is also good
Related
to be clear, I want to add a hamburger menu in an HTML web app that will open a menu screen when clicked. I want the menu to animate from the corner of the screen (where the menu button is located). I would like to accomplish this using HTML, CSS, or javascript because those are the languages I'm currently studying. If someone could recommend a beginner-friendly method to accomplish the above-stated goal, I would be extremely grateful. Thank you for your time.
To add on to #Paul's answer - definitely use Bootstrap, and if you are going to use Bootstrap, don't forget to link the Bootstrap library to your HTML file in your header and reference jquery and javascript near the end of your code. More complete instructions can be found here: http://getbootstrap.com/docs/4.0/getting-started/introduction/
If you are looking for an easy way to do it, I would reccomend Bootstrap as it is a great resource and CSS framework for creating lots of components. I suggest looking at its dropdowns library for creating a hamburger menu.
Cheers.
I want to achieve the twitter bootstrap navigation without using the twitter bootstrap framework. Here is my code pen http://www.codepen.io/anon/pen/Kedzl. Below is the image I want to achieve once the width of the .wrap reaches a certain specified width.
I have been searching for the JavaScript code to replicate this effect, but I haven't found it. The example can be found on and it's supporting documentation on http://webdesigntutsplus.s3.amazonaws.com/tuts/312_bs/My-Bootstrap-Site-NAVBAR/navbar-examples.html
http://getbootstrap.com/customize/
you could go here and just grab the nav
i want to create a collapsible menu or even better a spry menu using just css/HTML. I want to use it on eBay but javascript/jquery is not allowed. I have seen it on other peoples eBay.
A spry menu would be best but this is probably not possible without javascript
If you are looking for Pure CSS based menu then
try this fiddle http://jsfiddle.net/gajjuthechamp/xYFmh/
Source: http://purecssmenu.com/
You may have a look at 100 Great CSS Menu Tutorials
I'm working on this site http://fridasofia.se/wand/ and have used JavaScript to mark the current menu item with an arrow.
The problem is that if you use the scrollbar to scroll the page, instead of clicking the menu, the arrow that marks current menu item doesn't follow. How do I make it work?
Thanks /Frida
Such plugins called ScrollSpy. Here is most popular
Bootstrap
jquery-scrollspy
I recommend looking at the jQuery Waypoint plugin http://imakewebthings.com/jquery-waypoints/
It should have what you need.
I want to make a menu for the admin side of a website and when I saw the top bar of stubleupon I wanted to make a menu with same style, always on top even when you scroll down, and has drop down items.
here is the link to sumbleupon exemple :
http://www.stumbleupon.com/su/2qQfq3/www.thevirtualpiano.com/
and I am not very good in javascript so if anybody can point me where I can find a resource
or if there is any jquery plugins that does this work it would be great.
You don't have to use javascript if you didn't want to.
A navigation you want could be done in CSS only.
But here are my favourites:
multi level navigation examples
38 jQuery drop down