Grow your CSS skills. Land your dream job.

Sliding line navigation menu staying on active link

  • # May 5, 2013 at 11:45 pm

    I recently saw this and I began searching. I found something similar here. I was wondering is there a way to make the line stay on the active link (the page being viewed?) Or slide to link permanently when it is being clicked and the content is loaded(until a new link is clicked)? Or do I have to use ajax for that?

    http://css-tricks.com/jquery-magicline-navigation/

    # May 6, 2013 at 1:53 am

    if you look at how the code on that page works it is set to automatically set the “magic line” to move to be under the nav item withe the current_page_item class once the page loads. Just make sure that that class gets applied to the proper item and it should work. If you’re using a cms, it should do this by default, just view source and find out what the name of the class and update you’re code.

    If you’re doing a one page site or using ajax to bring in content, just add some code in there to set the current_page_item on click.

    # May 6, 2013 at 3:52 pm

    For Ajax or one page site I would need to set it on click so that when the content loads the line will move to that link’s content? For CMS I wouldn’t have to apply it to the link myself because it will be done automatically(since it knows which link I’ve clicked on)? Thanks

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".