Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

JQuery Nav Bar Problem

Posted on 2010-08-24
5
458 Views
Last Modified: 2012-05-10
I have a jQuery nav bar that is working just fine. I would like to make a change to it and have not been able to get it to work.

Currently, when the menu is loaded it highlights the section that the user is in. When the user points their mouse ofer another section, the nav bar has a slider that moves to that section title. What I would like to change if possible would be to have the section highlight remain in place and when the user put their mouse over another section title for the bar to move to highlight that section, but to also leave the original bar in place to keep the section they are in now highlighted. Then of course once they click on the new section and it loads, it will only highlight the newsection.

I have attached my files in a zip file. I am working with classic asp, but due to security restrictions on here, I named the file .html in order to be able to upload it.

I am greatful for any help you guys can provide.
Navbar.zip
0
Comment
Question by:DakotaKat
  • 3
  • 2
5 Comments
 
LVL 14

Expert Comment

by:R-Byter
ID: 33513380
When I try Your files I dont get the proper menu at all, something is messed up.
What browser do you use?
Can You point me to address where You develop Your project?
Also, You didnt mention that this is a ASP page, not the html.

Look at what I see when i put Your files to server and rename htm to asp.

http://www.bosko.rs/ee/Navbar/index.asp
0
 

Author Comment

by:DakotaKat
ID: 33513792
I'm sorry my bad, Throw this piece of code right under your body tag.

<%
Dim NavBarStartPoint

NavBarStartPoint = "home"
%>
0
 
LVL 14

Accepted Solution

by:
R-Byter earned 500 total points
ID: 33516878
Here You go. Add this line to Your .current_page_item_two a class in css file:

background-color: #eae5da;

You are "telling" the browser to keep #eae5da color at selected menu item and jquery mechanism works as it should. We basically just forced background color on selected item class.

Regards
0
 

Author Closing Comment

by:DakotaKat
ID: 33520448
Thank you so much! I was starting to loose my mind. It helps to have someone fresh look at your stuff.

Thanks again.
0
 
LVL 14

Expert Comment

by:R-Byter
ID: 33520773
You're welcome.
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question