PDA

View Full Version : Ok, so hi, and help plz

AshJ
03-07-2004, 07:01 AM
Hi, I'm Ash, I was searching the internet for html help when I came across this website and i thought it would be possible to get help from here.

So here's my problem, I'm building a website, and I want an option so that a link allows the colours on the page to be inverted. You know? So like my page is white on black at first, then you click the little link and it becomes black on white. Is it possible to do this without building completely seperate pages?

I wasn't quite sure where to put this so I just put it here, i hope it isnt a problem
agent002
03-07-2004, 07:28 AM
Hi Ash, and welcome to HTMLForums :)

The Introductions forum isn't really the best place to ask questions, just to introduce yourself. There might be people who could answer the question but don't visit the introductions forum, and hence miss it completely. But I will try to answer to it.

I guess the easiest solution would be to have two different stylesheets that a JavaScript swaps. Create two stylesheets called style1.css and style2.css, then put this code between the <head> and </head> tags:
<link id="style1" rel="stylesheet" href="./style1.css" type="text/css">
<link id="style2" style="display: none;" rel="stylesheet" href="./style2.scs" type="text/css">
<script type="text/javascript"><!--

function setstyle1(){
document.getElementById('style2').style.display = 'none';
document.getElementById('style1').style.display = '';
}

function setstyle2(){
document.getElementById('style1').style.display = 'none';
document.getElementById('style2').style.display = '';
}

--></script>
links:
<a href="http://www.google.com" onmouseover="setstyle1();" onmouseout="setstyle2();">Google</a>
Not sure if it works, haven't tested it. Good luck :)