Hide/show div with css only where it happens "onclick" - can this be done?

First, I am not looking for a javascript solution.I found decent CSS codes where it can be done with hover over option, but I want for the text/links to show onclick. You click a link it opens something, you click it again it closes it. Can this be done with CSS alone at all? Any help will be appreciated.

 

just create 2 html pages one with showing and one with not showing and link them up with each other

 

Not a bad idea. But in my case it won't work as I have hundreds of pages involved (it's a classified site). So... it will be pain in the butt to try to do something like that.

 

read the topic below onli one page play around with it mite help m not sure

http://w3schools.com/cssref/sel_hover.asp


a:link {color:green;}
a:visited {color:white;}
a:hover {color:red;}
a:active {color:white;}

 

• a:link - a normal, unvisited link
• a:visited - a link the user has visited
• a:hover - a link when the user mouses over it
• a:active - a link the moment it is clicked

http://www.w3schools.com/css/css_link.asp

sorri the first one is wrong link this is the right one.

mite help m not sure

 

You could try:

div {
visibility: hidden;
}
div:active {
display: visible;
}

But I think that would only work when you hold the mouse button down.

 

visibility not ​display

 

I will definitely try this. Sounds like it might work. Thanks for the tip.

 

You can also use links to set $_get variables. For example

 <?php 
IF($_GET['id']!=5){print ("<a href='?id=5'>Message 5</a>");}IF($_GET[id]==5){ print ("<a href='?id='>Text goes here</a>");}
?>

Code (markup):

 

I don't think that's the job of CSS. It's job is to style the content. Why don't you use jQuery or something like that?

 

You can't do click event in css You must use Javascript for that. In css you can do Mouse hover, focus and active....

 

http://css-tricks.com/examples/GarageDoorMenu/


try this i dont know if its only css or javascript aswel but its good

 

OP, what you're trying to do could NEVER be achieved with pure CSS. You MUST use JavaScript for a click event. The :active selector in CSS doesn't work the same. You have two options:

1) Use Javascript. Embed jQuery into your header and there are functions built in to achieve the desired functionality.

2) Use PHP or any other server side language to pass variables when you click the link, which will tell the next page to show the hidden div. Since it's a text link, you can only pass the variable via the "get" method if you want to go purely PHP (or whatever server side language you use).

However, I would use a combination of jQuery and PHP if I were you, along with JavaScript's <noscript></noscript> tags. That way if JavaScript is enabled, you can achieve what you want using JavaScript, but if it isn't, your HTML would rely on PHP instead. That's the logic I normally go for.