change the background color of anchor on click

Posted by Klbaiju under jQuery on 11/17/2011 | Points: 10 | Views : 14974 | Status : [Member] | Replies : 4

Write New Post |

Search Forums | Answered

Resolved Posts |

Un Answered Posts |

Forums Home

<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

Reply | Reply with Attachment

Alert Moderator

Responses

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

0	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

0	<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

<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

0	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

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

0	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

Latest Posts