473,856 Members | 1,836 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

menu link to not change color

Hello. I have a navigation bar at the top of all my pages with css-styled
buttons that change color when hovered over. I am a little confused on how
to disable that for the link that the page is on, for example, the sitemap
link in the navigation bar on the sitemap page, the studies link for the
navigation bar on the studies page, etc.

The css is at http://www.TheBicyclingGuitarist.net/css/style.css

The sitemap is at
http://www.TheBicyclingGuitarist.net/sitemap.htm

Any tips will be greatly appreciated. Do I need to make a new class and
surround the relevant link with <spantags, or is there a better way?
Thanks.

--
The Bicycling Guitarist
Jan 14 '08 #1
10 3920

"dorayme" <do************ @optusnet.com.a uwrote in message
news:do******** *************** ***********@new s-vip.optusnet.co m.au...
In article <47************ **********@read .cnntp.org>,
"The Bicycling Guitarist" <Ch***@TheBicyc lingGuitarist.n et>
wrote:
>Hello. I have a navigation bar at the top of all my pages with css-styled
buttons that change color when hovered over. I am a little confused on
how
First, yes, you can just class the link you do not want to have
hovering effects; <a class="current" href="...is a common
practice. You then style the .current how you wish in the css.
Second, you can also not have the link at all so not even a
cursor hand will appear, in this case you might style just the li
itself to fit in with the real links in style. It is common and
informational to have the text a little different, perhaps in
colour or background (this is an extra way for users to know
which page they are on out of the choices in the navigation strip.

Third, (but I have not studied your site properly so this may not
be convenient on the whole) you don't generally need to keep
putting class="menu2" if you use #menubar li a to specify a
style. It is briefer.
Thank you for your help, Dorayme.
Well I followed the first suggestion so far, but I plan to implement the
second suggestion (no link, just styling the li for the current page), and I
want to learn how to do the third suggestion. It's a little beyond me right
now. I automatically think "tic-tac-toe" when I see #.
Jan 14 '08 #2

"The Bicycling Guitarist" <Ch***@TheBicyc lingGuitarist.n etwrote in message
news:47******** **************@ read.cnntp.org. ..
Hello. I have a navigation bar at the top of all my pages with css-styled
buttons that change color when hovered over. I am a little confused on how
to disable that for the link that the page is on, for example, the sitemap
link in the navigation bar on the sitemap page, the studies link for the
Oh heck. I just noticed that the navigation bar for the site map page is a
wee bit smaller than the navigation bars on all the other pages. I think
this is because I have set styles for <pand <ain the header of the site
map page so they are only 90% regular size (because of all the links on that
page). What's the best fix for this without changing the 90% for the body
content? I don't want to assign a class name and put that into every single
<pand <aon the page.
Jan 14 '08 #3
In article <47************ **********@read .cnntp.org>,
"The Bicycling Guitarist" <Ch***@TheBicyc lingGuitarist.n et>
wrote:
"dorayme" <do************ @optusnet.com.a uwrote in message
news:do******** *************** ***********@new s-vip.optusnet.co m.au...
In article <47************ **********@read .cnntp.org>,
"The Bicycling Guitarist" <Ch***@TheBicyc lingGuitarist.n et>
wrote:
Third, (but I have not studied your site properly so this may not
be convenient on the whole) you don't generally need to keep
putting class="menu2" if you use #menubar li a to specify a
style. It is briefer.

Thank you for your help, Dorayme.
Well I followed the first suggestion so far, but I plan to implement the
second suggestion (no link, just styling the li for the current page), and I
want to learn how to do the third suggestion. It's a little beyond me right
now. I automatically think "tic-tac-toe" when I see #.
OK, about the third, here is a sort of case where the savings are
considerable - might get you to see how easy it is:

Suppose you want to float a *lot* of divs, you want them to be a
certain size as well and maybe other special things. Let us
suppose they are in a wrapper div.

<dv id="wrapper">.. .lots of divs within...</div>.

It is a bore (as well as adding to bandwidth and clutter) to
class every single inner div. It is easier to target them all in
one go by:

#wrapper div {float: left; width: ... etc ...;}

This targets all the div children of the #wrapper div. Not any
other divs elsewhere. You can also use classed wrappers. ID here
is just an example (to emphasise that it is unique and therefore
a rather nice handle to identify a whole mob of its children).

From what I did see of your css, I am sure you do understand this
idea to a degree (see your own css!).

--
dorayme
Jan 14 '08 #4

"The Bicycling Guitarist" <Ch***@TheBicyc lingGuitarist.n etwrote in message
news:47******** **************@ read.cnntp.org. ..
>
"The Bicycling Guitarist" <Ch***@TheBicyc lingGuitarist.n etwrote in
message news:47******** **************@ read.cnntp.org. ..
>Hello. I have a navigation bar at the top of all my

Oh heck. I just noticed that the navigation bar for the site map page is a
wee bit smaller than the navigation bars on all the other pages. I think
this is because I have set styles for <pand <ain the header of the
site map page so they are only 90% regular size (because of all the links
on that page). What's the best fix for this without changing the 90% for
the body content?
For now, I removed the 90% from the css in the header. I could add it back
for the div containing the sitemap content, or not. I thought that with so
many links, that having slightly smaller text would be more useful.
Jan 14 '08 #5
On 14 Jan, 06:35, dorayme <doraymeRidT... @optusnet.com.a uwrote:
There are some server side solutions so the page itself "knows"
which page it is and "turns off" links to itself. In PHP.
You can do that statically too.

Put a "pagename" class onto the body for each page.

Use slightly more complex CSS selectors (including a hard-coded list
of pagenames) to recognise each of these.
The cost of this is needing to hard-code that list into the CSS, but
it works, and it works with static code.
Jan 14 '08 #6
In article
<c2************ *************** *******@k2g2000 hse.googlegroup s.com
>,
Andy Dingley <di*****@codesm iths.comwrote:
On 14 Jan, 06:35, dorayme <doraymeRidT... @optusnet.com.a uwrote:
There are some server side solutions so the page itself "knows"
which page it is and "turns off" links to itself. In PHP.

You can do that statically too.

Put a "pagename" class onto the body for each page.

Use slightly more complex CSS selectors (including a hard-coded list
of pagenames) to recognise each of these.
The cost of this is needing to hard-code that list into the CSS, but
it works, and it works with static code.
Actually, thanks for the reminder on this. I speak, of course, on
behalf of the archives. <g>

--
dorayme
Jan 14 '08 #7

"dorayme" <do************ @optusnet.com.a uwrote in message
news:do******** *************** ***********@new s-vip.optusnet.co m.au...
In article <47************ **********@read .cnntp.org>,
"The Bicycling Guitarist" <Ch***@TheBicyc lingGuitarist.n et>
wrote:
>"dorayme" <do************ @optusnet.com.a uwrote in message
news:do******* *************** ************@ne ws-vip.optusnet.co m.au...
In article <47************ **********@read .cnntp.org>,
"The Bicycling Guitarist" <Ch***@TheBicyc lingGuitarist.n et>
wrote:
Third, (but I have not studied your site properly so this may not
be convenient on the whole) you don't generally need to keep
putting class="menu2" if you use #menubar li a to specify a
style. It is briefer.
>now. I automatically think "tic-tac-toe" when I see #.

OK, about the third, here is a sort of case where the savings are
considerable - might get you to see how easy it is:
<snip>
<dv id="wrapper">.. .lots of divs within...</div>.

It is a bore (as well as adding to bandwidth and clutter) to
class every single inner div. It is easier to target them all in
one go by:

#wrapper div {float: left; width: ... etc ...;}

This targets all the div children of the #wrapper div. Not any
other divs elsewhere. You can also use classed wrappers. ID here
is just an example (to emphasise that it is unique and therefore
a rather nice handle to identify a whole mob of its children).

From what I did see of your css, I am sure you do understand this
idea to a degree (see your own css!).
I understand it to a degree, but based on the online tutorials I've found
for css I'd rate myself at the low intermediate level, above beginner but
far below advanced. This newsgroup and the c.i.w.a.h. newsgroup have helped
me a lot over the years. What you have suggested with this tip is the next
great project for me to improve the code of my web site. It may take a while
yet.
Jan 15 '08 #8
Art
On 1/14/08 7:16 AM, Andy Dingley wrote:
On 14 Jan, 06:35, dorayme <doraymeRidT... @optusnet.com.a uwrote:
>There are some server side solutions so the page itself "knows"
which page it is and "turns off" links to itself. In PHP.

You can do that statically too.

Put a "pagename" class onto the body for each page.

Use slightly more complex CSS selectors (including a hard-coded list
of pagenames) to recognise each of these.
The cost of this is needing to hard-code that list into the CSS, but
it works, and it works with static code.
Andy,
Do you have a code snippet or live example of this static method that
you could share ?

TIA.

--
Art
Jan 15 '08 #9
On 16 Jan, 01:51, dorayme <doraymeRidT... @optusnet.com.a uwrote:
Hey, Andy! I notice the archive references are so easy to find
that you find it quicker to bang up examples on a keyboard.
I don't. I pasted that from an article in my own local archives - the
subject line was "Navigation ", if you want to look for it.
Jan 16 '08 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
4346
by: ajay | last post by:
I have following code for a slide menu but i twiked it to work for a single level menu. Open it in a Browser to get a clear picture. I have 2 Qs 1) How to make first entry as non-link. i.e i want to make first text as Table Heading/menu category. For examle in the given menu i want to make a heading as "Comp. Languages" which won't be a link. 2) The position of this menu is absolute to the page. I want to make it absolute to the Table...
14
3957
by: Don G | last post by:
Within the menu for my site, I have inserted 'class="current"' within the link for the current page. So the link looks somthing link: <li><a href="index.php" class="current">Home</a></li> The css for formatting the menu links is: #menu a:hover { background-color: #E00080; color: white;
4
5791
by: Yuk Cheng | last post by:
<<<start index.htm>>> <html> <head> <script> function perform(action){ } </script> </head>
1
2764
by: Richard | last post by:
http://dynamicdrive.com/dynamicindex1/switchmenu.htm I want to add a second level menu item to the existing design. Currently only one level is possible. Item 1 ......link ......link item 2 item 3
4
4009
by: paula | last post by:
I've got a problem with asp.net i am trying to make a menu control. and have searched the web for serveral controls but they don't work correctly. I am pretty new to asp.net building. What am i looking for. i am looking for code to make a dynamical menu with submenus The menu items are stored in a MS SQL Table and when by loading the page the items will be created. i have made a asp table. i want my menu on the left cell, in the middle...
3
11158
roula
by: roula | last post by:
Hi, I'm modifying a template (flash menu with html pages), when you click on the flash menu (about us for example) the corresponding html page is displayed, and the "about us" flash menu is highlighted. This is already done with the template I bought, they have HTML files named ad index-1.html index-2.html, etc... The problem is that they didn't have a link to the home page, so I modified one of the already existing menu and put "home...
5
2618
by: mukeshrasm | last post by:
hello friends I am new to javascript and I have a problem. I am giving the code <!-- Paste this code into the CSS section of your HTML document --> <html> <head> <style type="text/css"> .menu { position:relative; background-color:gold;
7
5573
by: milestogofromhere | last post by:
It is late so this is probably something really obvious but I am not seeing it. Can someone please help? Here is the page in question: html - http://www.itsyourplate.com/index2.php css - http://www.itsyourplate.com/thin.css As you can see from the file the menu is showing up vertically not horizontally. I copied the code directly from another site I have done and changed the bullets (I didn't want any) and the colors but I must have...
4
2385
by: N00b13 | last post by:
I have a great JS menu but I have to update every page each time I want to change a link. Is there a way to store my links in a file and call it so i only change that file? (what I have tried so far has not worked, but then again my JS really never works :) ) my .js: if (typeof Scl == "undefined") { var Scl = {}; } (function()
0
9911
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
1
10780
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
10383
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
9530
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7932
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
7093
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5958
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
4575
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
4174
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.