...

View Full Version : Javascript choosing colors and CSS



Athmaus
04-14-2005, 06:05 PM
Hello,

I have this script that allows users that goto my site to change the appearce of the site thanks to different CSS. I have a special section in the site that when you roll over it changes colors. I want that color change to be a dark color that goes with that particual theme.

In short my question is this. If someone chooses for instances: darkblue.css, how does the if...else... syntax work so that the highlighting will be a dark green (for instance). But if someone choose red.css i want that highlighting to be a dark blue. (Does this make sense?)

Below is my code for the switch of the CSS. At the very bottom is my "highlighting" code.


Selection of CSS Code
var today = new Date();
var expiry = new Date(today.getTime() + 365 * 24 * 60 * 60 * 1000);

function doSkin(skin) {
document.getElementById("skin").href='css/' + skin + '.css';
document.cookie="skin=" + escape(skin) + "; expires=" + expiry.toGMTString() + "; path=/";
if (document.all) {
var sel = document.getElementsByTagName("SELECT")
for (i=0;i<sel.length;i++) {
sel[i].style.visibility = "hidden";
sel[i].style.visibility = "visible";
}
}
window.location.reload();

}

function drawSkinSelector() {
if (document.getElementById) {
str = "";
str += "<select name=\"skinsel\" onchange=\"doSkin(this.options[this.options.selectedIndex].value)\" class=\"searchbox\">";
str += "<option value=\"default\">Switch Skin</option>";
str += "<option value=\"default\">Grey</option>";
str += "<option value=\"chocolate_rose\">Chocolate Rose</option>";
str += "<option value=\"forest\">Forest</option>";
str += "<option value=\"mint\">Mint</option>";
str += "<option value=\"acidblue\">Acid Blue</option>";
str += "<option value=\"darkblue\">Dark Blue</option>";
str += "<option value=\"khaki\">Khaki</option>";
str += "</select>";
}
else {
str = "<img src=\"http://www.yoursite.com\">";
}
document.write(str);

}

function browserChk() { // write dumbed-down CSS document for Netscape 4
var nm = navigator.appName.indexOf("Netscape") != -1;
var vers = parseInt(navigator.appVersion);
if (nm && (vers == 4)) {
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"http://www.www.yoursite.com/skin/darkblue.css\">");
}
}



Highlight code
function movein(which){
which.style.background='C8C8A0'
}

function moveout(which){
which.style.background=' '
}

A1ien51
04-14-2005, 06:14 PM
I would suggest that you specify a class Name in the css files. That will make it easier in my mind since you would not have to wrroy about if statement.


function movein(which){
which.className = "highlight";
}

Eric

Athmaus
04-14-2005, 07:01 PM
I would suggest that you specify a class Name in the css files. That will make it easier in my mind since you would not have to wrroy about if statement.


function movein(which){
which.className = "highlight";
}

Eric

Pardon my stupidity, but i cant get it to work

I put this in one of my css files that i am testing:

CSS Highligh
.highlight {
color : #ffffff;
}


than i put that code that you gave

function movein(which){
which.className = "highlight";
}


And now when you move over a paticular spot, the highlight only stays for a milisecond, and if you move mouse over it again it will not show up.

Athmaus
04-14-2005, 07:26 PM
hey!

i finally got it to work, i had to declare the "moveout" function as another class. Once i did that it started working correctly. Thanks for your help



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum