Fashana
Fashana

Reputation: 31

hide CSS page by click on other link

I was wondering, I got this code:

<li><a href="#home">Home</a></li> 
<li><a href="#link1">Link 1</a></li>

And this code in CSS:

#link1
{
display: none;
}

#link1:target
{
display: block;
}

Also some design-stuff but it's included in the li part in my CSS code, so it's not needed here.

Right now, my homepage is always visible. How do I make the home-part disappear when I click on "Link 1"? Because now the content of "Link 1" appears beneath the home-content, instead of in its place (for which the home-content would have to disappear, which I said, it doesn't)

I'd like to keep everything in one html-document, that's why I'm using CSS, instead of linking to another page, which would probably make this a lot easier.

If I'm not clear or you need some extra code just tell me, but please do tell me what is unclear then. Thanks :]

Upvotes: 0

Views: 98

Answers (2)

Salketer
Salketer

Reputation: 15711

Give a try to jQuery tabs. Very easy to use and it will do it all for you. http://jqueryui.com/demos/tabs/

Upvotes: 1

MikeB
MikeB

Reputation: 2452

Have you tried javascript/jQuery at all?

$('#link1').click(function() 
{
  $('#home').hide();
});

Upvotes: 2

Related Questions