PDA

View Full Version : Is it possible to change the .css href? (You should know both javascript and css)



Unicrown
Feb 17th, 2003, 09:58 PM
I'm planning my website (again....), and I wanted to have a different style for each day of the week!

'Simple!' I thought! So I entered the code... then it struck me. I was going to have so many different styles. Lemme list a few

WednesdayTitle, sundaybackgroung, mondaytext,tuesdayalttext, etc.



Why not just take 7 different .css stylesheets, each with the same name for the styles, so instead of having to use javascript to change EVERY single tag to a different style depending of the day of the week, I could just change the stylesheet used.

So I tried javascript.

<link rel = "stylesheet" href = "" type = "text/css" id = "dayofweek">

document.dayofweek.href = "sunday.css".

I tried that, the stylesheet didn't come up! It was just a plain boring page.

Is there anyway I can change the stylesheet or do I have to proceed with my first method!

redhead
Feb 17th, 2003, 10:18 PM
welcome to the forums! :)

umm... methinks this might work...



<script>
var mydate=new Date()
var today=mydate.getDay()
var css="";
if (today==1) // monday
css="monday.css"
else if (today==2) // tuesday
css="tuesday.css"
else if (today==3) // wednesday
css="wednesday.css"
else if (today==4) //thursday
css="thursday.css"
else if (today==5) // friday
css="friday.css"
else if (today==6) //saturday
css="saturday.css"
else // sunday
css="sunday.css"

document.writeln('<link rel="stylesheet" type="text/css" href="'+css+'">');

//-->
</script>
<noscript>
<link rel="stylesheet" type="text/css" href="whole_week.css">
</noscript>

just make sure you have monday.css through to sunday.css... and i threw in a whole_week.css for them peeps without javascript...

joh6nn
Feb 17th, 2003, 10:36 PM
a more compact version:

<script><!--
dayNames = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
dayNumber = new Date().getDay();
document.writeln('<link rel="stylesheet" type="text/css" href="' + dayNames[dayNumber] + '.css">');
//--></script>
<noscript>
<link rel="stylesheet" type="text/css" href="default.css">
</noscript>

Catman
Feb 17th, 2003, 10:38 PM
I tried something similiar to what redhead suggested but had troubles with either Netscape or IE 5.0 for Macs (I can't remember which -- but the style sheets wouldn't load).

What I settled on isn't a particularly good way to accomplish what you're looking for (since it doesn't work with Opera, and since it generates a load of warnings with CSS validators), but it gets the job done. You may be able to adapt the script to your needs.

English 313 (http://www1.iastate.edu/~wsthune/engl313/)

Unicrown
Feb 18th, 2003, 02:27 AM
Just a minor question..... what does <noscript> do?

l3vi
Feb 18th, 2003, 03:11 AM
noscript is when a user does not have javascript. So if the user does not have javascript, it means it will automatically have it go to the every day of the week stylesheet.