a:link, active, hover, visited....

mcdanielnc89 · #1 Oct 22nd, 2007, 17:40

Okay, I don't know that it's for this but I think it is. I am wanting to change the color of the word when i'm on that page.. like say i hover over the word forums and it loads the page, I want it to change the color to the hover color and so on. lol.. I hope i explained this good enough.

How do I do that? lol...

karinne · #2 Oct 22nd, 2007, 17:44

I don't get it ... but ... did you look at the CSS Beginner FAQ? There's one on How do I change the color of my links?

mcdanielnc89 · #3 Oct 22nd, 2007, 18:08

yes i did look there but didn't find anything.

this is what i'm wanting to do WHEN the page is on monthlysignin

i want it like this
likethis.jpg

not liek this:
notlikethis.jpg

Marc · #4 Oct 22nd, 2007, 18:12

You will need to create a .current class or whatever you want to call it...

mcdanielnc89 · #5 Oct 22nd, 2007, 18:20

so in my html i'll put class="current"

and my css would be like...

Code: Select all

a.current {
  background-color: #ffffff;
 color: #000000;
 text-decoration: none;
  padding: 0px 0px 1px 20px;
}

karinne · #6 Oct 22nd, 2007, 18:25

Well ... is that one hover or when you are on THAT page and you want that style?

mcdanielnc89 · #7 Oct 22nd, 2007, 19:55

when im on that page i want THAT style, lol.

AdRock · #8 Oct 22nd, 2007, 21:37

Would it not be the active link that you need to add properties for seeing as that link is active

mcdanielnc89 · #9 Oct 22nd, 2007, 21:44

I tried that AdRock. lol.. I jsut dunno haha.... I tried it but it didn't work

'

And I need to speak with you as well hehe.. So if you get free IM me please, lol.

AdRock · #10 Oct 22nd, 2007, 21:51

Actually, i don't know why i suggested that becuase it will only change while you hold the link down

Monie · #11 Oct 23rd, 2007, 04:44

Quote:

Originally Posted by mcdanielnc89

when im on that page i want THAT style, lol.

This is not related to hover, active visited or what ever.
I have done this king of technique in my page not long ago, but I can't host it because, mmm... time consuming.

I'll guide you through it tho,

Let's make this clear..
In every page that you visited, you want the menu to have a special different king of color, am I right?

Your CSS:

Code: Select all

.selected a { 
    display: block;
    text-decoration: none;
    font: small verdana; 
    font-size: 12px;
    color: #99cc33;
    margin: 0; 
    padding: 0;
    width: 100%;
    height: 100%;
    background: #000; /* Make the button black for selected page */
}
.nonselected a {
    your default setting all your button color, font, etc..
}

Code: Select all

(home.asp page)
<div class="selected"><a href="default.asp">Home</a></div>
<div iclass="notselected"><a href="aboutme.asp">About Us</a></div>
<div class="notselected"><a href="#">Monthly Sign-In</a></div>
<div class="notselected"><a href="#">Forums</a></div>

Code: Select all

(aboutUs.asp page)
<div class="notselected"><a href="default.asp">Home</a></div>
<div class="selected"><a href="aboutUs.asp">About Us</a></div>
<div class="notselected"><a href="#">Monthly Sign-In</a></div>
<div class="notselected"><a href="#">Forums</a></div>

there you go...

mcdanielnc89 · #12 Oct 23rd, 2007, 05:18

hmm nice. I owe u big time, lol..

Monie · #13 Oct 23rd, 2007, 05:21

Quote:

Originally Posted by Marc

You will need to create a .current class or whatever you want to call it...

Marc "saw" it first, lol.

mcdanielnc89 · #14 Nov 2nd, 2007, 23:09

Hmm, I'm now back to working on this problem, lol..

my CSS is

HTML: Select all

.selected a { 
    display: block;
    text-decoration: underline;
    font-family: Arial, Verdana, sans-serif; 
    font-size: 10pt;
    color: #ffffff;
    margin: 0; 
    padding: 0;
    width: 100%;
    height: 100%;
    background-color: #000; /* Make the button black for selected page */
}
.nonselected a {
    your default setting all your button color, font, etc..
}

them my html is

HTML: Select all

      <ul id="menu">
   <div class="selected"><li><a href="index.php" class="current">Home</a></li></div>
   <div class="notselected"><li><a href="index.php?page=aboutus" class="current">About Us</a></li></div>
   <div class="notselected"><li><a href="index.php?page=signin">Monthly Sign-in</a></li></div>
   <div class="notselected"><li><a href="index.php?page=statementoffaith">Statement of Faith</a></li></div>
   <div class="notselected"><li><a href="http://www.forums.newbreedjesusfreaks.com">Forums</a></li></div>
   <div class="notselected"><li><a href="index.php?page=rules">Rules</a></li></div>
   <div class="notselected"><li><a href="http://www.chat.newbreedjesusfreaks.com">Chatroom</a></li></div>
   <div class="notselected"><li><a href="index.php?page=downloads">Downloads</a></li></div>
   <div class="notselected"><li><a href="index.php?page=requests">Requests</a></li></div>
   <div class="notselected"><li><a href="index.php?page=tencommandments">Ten Commandments</a></li></div>
   <div class="notselected"><li><a href="#">Pictures</a></li></div>
   <div class="notselected"><li><a href="index.php?page=staff">Staff</a></li></div>
   <div class="notselected"><li><a href="index.php?page=memberofthemonth">Member of the Month</a></li></div>
   <div class="notselected"><li><a href="index.php?page=puritypledge">Purity Pledge</a></li></div>
   <div class="notselected"><li><a href="index.php?page=links">Links</a></li></div>
   <div class="notselected"><li><a href="index.php?page=search">Search</a></li></div>
   <div class="notselected"><li><a href="index.php?page=donate">Support Us</a></li></div>
   <div class="notselected"><li><a href="index.php?page=contactus">Contact Us</a></li></div>
      </ul>

I don't rightfully understand this. lol.. if i click another page it doe snothing. only home is selected.. what exactly must I do.. i hope it's not what I'm thinking cuz that would take ages, lol.

MotorManiac · #15 Nov 3rd, 2007, 02:12

yes, you have to go into every page and write the selcted class on the link you want selected.

Stuart · #16 Nov 3rd, 2007, 04:10

motormaniac is right, on every page the .selected class needs to be applied to the corresponding link. But, as I was looking through your html, I noticed that you have only one page - index.php, and the content is determined by ?page=NameOfPage. This means that the .selected class won't work! You need a separate page for each link to make all of this work... Am I making sense? Point is, the way you have it set up will fail.

Cheers,
SWagner

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
a:link, active, hover, visited....