change the background color of anchor on click

Posted by Klbaiju under jQuery on 11/17/2011 | Points: 10 | Views : 9424 | Status : [Member] | Replies : 4
<div class="hotevent-upcomevent">
<ul id="countrytabs" class="shadetabs">
<li><a href="#" rel="country1" class="">Hot Events</a></li>
<li><a class="" href="#" rel="country2">Upcoming Events</a></li>
</ul>
</div>

hi,
in this application if i press an anchor tag,i want to change the background color of the other anchor tag to black

using jquery.
how it is possible.

Regards
K L BAIJU




Responses

Posted by: RohiK on: 11/17/2011 [Member] Starter | Points: 25

Up
0
Down
Hi

a:link (how a link will appear on a page)
a:hover (how a link will appear when you move the mouse over it)
a:active (how a link will appear when you click on it)
a:visited (how a link will appear to show it has been clicked on already)

Happy Programming!!
Rohi

Klbaiju, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: perfectchourasia-9163 on: 11/17/2011 [Member] Starter | Points: 25

Up
0
Down
<html>
<head>
<style type="text/css">
a:link {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */
</style>
</head>

<body>
<p><b><a href="default.asp" target="_blank">This is a link</a></b></p>
<p><b>Note:</b> a:hover MUST come after a:link and a:visited in the CSS
definition in order to be effective.</p>
<p><b>Note:</b> a:active MUST come after a:hover in the CSS definition in order
to be effective.</p>
</body>
</html>

ER sandeep chourasia
sandeepchrs@yahoo.com (on facebook)
http://www.aspnetcodes.com/

Klbaiju, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Klbaiju on: 11/17/2011 [Member] Starter | Points: 25

Up
0
Down
i need like this code
<style type="text/css">

.hover { background-color: blue; color: #fff; }
.nonhover { background-color: red; color: #fff; }

</style>
<div>
<ul>
<li><a href='#'>example1</a></li>
<li><a href='#'>example2</a></li>

</ul>

</div>

$(document).ready(function() {
$('a').click(function() {

$(this).addClass('nonhover').siblings().addClass('hover');

})

Klbaiju, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Walia_jagwinder on: 11/17/2011 [Member] Starter | Points: 25

Up
0
Down
use hover property to change the color

One person's data is another person's program.

Klbaiju, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response