/    Sign up×
Community /Pin to ProfileBookmark

highlight a link

Hello,

I have the below code. I am trying to highlight the link when i click a link. it works fine when i hover over the link. But it does not work when i release the mouse. I want the link name to be highlighted as long as i am on the page.

Please advise.

[code=html]<html>
<style>
a {
background-color:#00f;
}
a:hover,a.current {
background-color:#f00;
}
</style>

<body>
<ul id=”navigation”>
<li><a href=”highlightLink.php”>Home Page</a></li>
<li><a class=”current” href=”highlightLink.php”>About Me</a></li>

</ul>

</body>

</html>[/code]

to post a comment
HTML

10 Comments(s)

Copy linkTweet thisAlerts:
@Strider64Nov 29.2013 — [code=html]<html>
<style>
a {
background-color:#00f;
}
a:hover,a.current {
background-color:#f00;
}
.selected {
background-color: #f00;
}
</style>


<body>
<ul id="navigation">
<li><a href="highlightLink.php"><span class="selected">Home Page</span></a></li>
<li><a class="current" href="highlightLink.php">About Me</a></li>

</ul>

</body>

</html>[/code]
Copy linkTweet thisAlerts:
@SEO_LandNov 29.2013 — Strider64 is right, by adding a HighlightLink.php file you can get highlighted the link text till visitor is on the page.
Copy linkTweet thisAlerts:
@newcoder24authorNov 29.2013 — Strider64 is right, by adding a HighlightLink.php file you can get highlighted the link text till visitor is on the page.[/QUOTE]

It did not work. Once I click, it gets a blink then the link name does not get highllighted.
Copy linkTweet thisAlerts:
@arronmattwillsNov 29.2013 — Apply the current class to list. Then modify your css.

.current a { ..... }
Copy linkTweet thisAlerts:
@kralcxNov 30.2013 — a:visited

{

background-color:yellow;

}
Copy linkTweet thisAlerts:
@jedaisoulDec 04.2013 — Hello,

I have the below code. I am trying to highlight the link when i click a link. it works fine when i hover over the link. But it does not work when i release the mouse. I want the link name to be highlighted as long as i am on the page.
[/QUOTE]

This does not make sense to me. How can you still be on the same page if you have clicked a link???
Copy linkTweet thisAlerts:
@auntniniDec 04.2013 — At http://auntnini.com/sites/index.html my style sheet gives me focus color as long as pop-up window is active:

<i>
</i>a { font-weight: normal; text-decoration: none; color: black; } /* #cc0033 #fc0 */
a:link { text-decoration: none; background: none; }
a:visited { color: #5d5d5d; /* #f30 firebrick*/ }
a:hover { text-decoration: underline; color: #F09; /*orange F90 red 39F pink F3C red cc0033; */ }
a:focus { color: orange; }
a:active { text-decoration:none; color: lime;/*blueGrey8899aa*/ }
a:target { }
Copy linkTweet thisAlerts:
@happycodingsDec 17.2013 — http://html-css.happycodings.com/hyperlink-style-link-visited-hover-focus-active.html

Hyperlink style link visited hover focus active

<?xml version"1.0" encoding="UTF-8"?>

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<style type="text/css">

a:link {

color: pink;

text-decoration: none

}

a:visited {

color: red;

text-decoration: none;

}

a:hover {

color: aqua;

text-decoration: underlined;

}

a:active {

color: blue;

text-decoration: none;

}

a:focus {

color: orange;

text-decoration: underlined;

}

</style>

<title>Hyperlink Style Link Visited Hover Focus Active</title>

</head>

<body>

<p>

<a href="[email protected]">Send Feedback</a>

</p>

</body>

</html>
Copy linkTweet thisAlerts:
@Imran60Dec 18.2013 — Hello,

I have the below code. I am trying to highlight the link when i click a link. it works fine when i hover over the link. But it does not work when i release the mouse. I want the link name to be highlighted as long as i am on the page.

Please advise.



[code=html]<html>
<style>
a {
background-color:#00f;
}
a:hover,a.current {
background-color:#f00;
}
</style>


<body>
<ul id="navigation">
<li><a href="highlightLink.php">Home Page</a></li>
<li><a class="current" href="highlightLink.php">About Me</a></li>

</ul>

</body>

</html>[/code]
[/QUOTE]



Change the main method and then try to highlight a link.
Copy linkTweet thisAlerts:
@madhusharmaDec 27.2013 — Hope this code helps:

<html>

<style>

a :hover,a.current{

background-color:#00FFFF;

}

a:hover,a.current {

background-color:#00FFFF;

}

</style>


<body>

<ul id="navigation">

<li><a href="highlightLink.php">Home Page</a></li>

<li><a class="current" href="highlightLink.php">About Me</a></li>

</ul>

</body>

</html>
×

Success!

Help @newcoder24 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.3,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...