How do you toggle links to stay a certain color until clicked again
I'm trying to mak开发者_如何学编程e it so that when I click on a link, it makes it stay a certain thing, and then when clicked again, change back.
How do I go about doing this? Can i do it in html + css? or i need js?
You can do this with CSS + jQuery:
CSS:
a{
color: blue
}
a.clicked{
color: red;
}
jQuery:
$(document).ready(function(){
$('a').click(function(){
$(this).toggleClass('clicked');
});
});
You can check an example here »
If only looking for pure Javascript and HTML:
function toggle_link(select){
var color = select.style.color;
select.style.color = (color == "blue" ? "green" : "blue");
}
And in your HTML, use the onclick attribute.
<a onclick="toggle_link(this)" style="color:blue">Click to change color!</a>
A working fiddle: jsFiddle
You'll definitely need JavaScript for that. (If you want to 'cheat' create 2 HTML pages with the same content except the links, so you can link them together but with a different name.)
精彩评论