How to change a word colour (a link) in navbar when clicked?

JavaScript related questions should go here.
Post Reply
brisk
Posts: 26
Joined: Mon Nov 21, 2011 1:22 am

How to change a word colour (a link) in navbar when clicked?

Post by brisk »

So I have my navbar:

What I want to do is... if the user is on index.php then 'latest post's in the navbar turns red, if the user is on ideas.php then 'ideas' in the navbar turns orange, if the user is on facts.php then 'facts' in the navbar turns yellow.

When one of these navbar words changes the colour, the rest still are white.

<div id="navbar">
	<ul>
		<li><a class = "latest_posts_nav" href="index.php">latest posts</a></li>
        <li>|</li>
		<li><a class = "ideas_nav" href="ideas.php">ideas</a></li>
        <li>|</li>
		<li><a class = "facts_nav" href="facts.php">facts</a></li>
        <li>|</li>
		<li><a class = "quotes_nav" href="quotes.php">quotes</a></li>
        <li>|</li>
		<li><a class = "articles_nav" href="articles.php">articles</a></li>
        <li>|</li>
		<li><a class = "images_nav" href="images.php">images</a></li>
	</ul>
</div>

I presume it's javascript of some sort?
User avatar
jacek
Site Admin
Posts: 3262
Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:

Re: How to change a word colour (a link) in navbar when clic

Post by jacek »

I would probably do this with php actually. Add a class to the link for the current page, something like this
<li><a class = "latest_posts_nav <?php if ($page === 'index') echo 'selected'; ?>" href="index.php">latest posts</a></li>
<li>|</li>
<li><a class = "ideas_nav<?php if ($page === 'ideas') echo ' selected'; ?>" href="ideas.php">ideas</a></li>
<li>|</li>
then you can just style it with css.
Image
brisk
Posts: 26
Joined: Mon Nov 21, 2011 1:22 am

Re: How to change a word colour (a link) in navbar when clic

Post by brisk »

I'm confused as to how/what I'd be setting the $page variable as?
User avatar
jacek
Site Admin
Posts: 3262
Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:

Re: How to change a word colour (a link) in navbar when clic

Post by jacek »

There must be something that contains the name of the current page ? Maybe $_GET['page'] ? However your template system is set up :?
Image
brisk
Posts: 26
Joined: Mon Nov 21, 2011 1:22 am

Re: How to change a word colour (a link) in navbar when clic

Post by brisk »

jacek wrote:There must be something that contains the name of the current page ? Maybe $_GET['page'] ? However your template system is set up :?
Yeah I just through of that, I want to know as well...if you go to my site the index.php is not actually in the URL, if i use the get method will it pick it up?
User avatar
jacek
Site Admin
Posts: 3262
Joined: Thu May 05, 2011 1:45 pm
Location: UK
Contact:

Re: How to change a word colour (a link) in navbar when clic

Post by jacek »

Yeah it should still work, as long as you use the right string in the if statement.

If $page contains "index" don't do
if ($page === 'index.php')
because that will obviously never be true.
Image
brisk
Posts: 26
Joined: Mon Nov 21, 2011 1:22 am

Re: How to change a word colour (a link) in navbar when clic

Post by brisk »

Sweet, think i got it working!!

Cheers dude, was really smart thinking there
Post Reply