switching between stylesheets

W

Wade

Im attempting to help fix a problem on a local weather site. They have
this server side c# code they were using but the programmer left and
left them hanging. I removed that code and found this script in a
tutorial. It wasnt used in the manner in which Im using it right now
so I would appreciate some help.

<script type="text/javascript">
function detect() {
if(screen.width==800 || screen.height==600) {

document.write("<link rel="stylesheet" type="text/css" href="weather-
screen_b.css" media="screen" title="screen" />");

} else {

document.write("<link rel="stylesheet" type="text/css" href="weather-
screen.css" media="screen" title="screen" />");

}
}
</script>
 
V

VK

Im attempting to help fix a problem on a local weather site. They have
this server side c# code they were using but the programmer left and
left them hanging. I removed that code and found this script in a
tutorial. It wasnt used in the manner in which Im using it right now
so I would appreciate some help.

<script type="text/javascript">
function detect() {
if(screen.width==800 || screen.height==600) {

document.write("<link rel="stylesheet" type="text/css" href="weather-
screen_b.css" media="screen" title="screen" />");

} else {

document.write("<link rel="stylesheet" type="text/css" href="weather-
screen.css" media="screen" title="screen" />");

}
}

</script>
Click to expand...

So what exactly your question is?
 
W

Wade

So what exactly your question is?
Click to expand...

This is not printing out either style sheet.
This is in the <head> section of the document.
Can it not print there?
Is it written incorrectly?
 
D

Doug Gunnoe

This is not printing out either style sheet.
This is in the <head> section of the document.
Can it not print there?
Is it written incorrectly?- Hide quoted text -
Click to expand...

document.write does not function they way you are trying to use it.

Maybe something like this.

you have this in the head section of your document
<link id="yourLinkID" rel="stylesheet" type="text/css"
href="style1.css">

you get a reference to the above link element in your script like so:
myStyle = document.getElementById("yourLinkID");

if 800 X 600, change the href attribute to the style you want to use
myStyle.href="style2.css"
 
T

Thomas 'PointedEars' Lahn

Wade said:
Im attempting to help fix a problem on a local weather site. They have
this server side c# code they were using but the programmer left and
left them hanging. I removed that code and found this script in a
tutorial. It wasnt used in the manner in which Im using it right now
so I would appreciate some help.

<script type="text/javascript">
function detect() {
if(screen.width==800 || screen.height==600) {
Click to expand...

Your approach is wrong, so your attempts to fix the problem will eventually
be futile. Neither can the display resolution be detected reliably, nor
does it matter regarding the viewport size and therefore the presentation of
the Web site. See also http://dorward.me.uk/tmp/fullscreen.jpeg

Even if you are able to determine the viewport size with scripting, as laid
out in <http://jibbering.com/faq/#FAQ4_9>, you would need client-side script
support to be present which you cannot rely on either. So you should invest
your time and your customer's money into making this one an accessible Web
site instead; see also <http://www.w3.org/WAI>.


HTH

PointedEars
 
S

SAM

Wade a écrit :
This is not printing out either style sheet.
Normal.

This is in the <head> section of the document.
OK

Can it not print there?
Click to expand...

That will print nothing (nothing humanly visible)
Is it written incorrectly?
Click to expand...

Yes, a little ( take note of ' and " )

<script type="text/javascript">
function detect() {
if(screen.width==800 || screen.height==600) {
document.write('<link rel="stylesheet" type="text/css" '+
'href="weather-screen_b.css" ' +
'media="screen" title="screen" />');
} else {
document.write('<link rel="stylesheet" type="text/css" ' +
'href="weather-screen.css" ' +
'media="screen" title="screen" />');
}
}

detect();

</script>



or :

<script type="text/javascript">

var detect = (screen.width==800 || screen.height==600)?
'weather-screen_b.css' : 'weather-screen.css';

document.write('<link rel="stylesheet" type="text/css" '+
'href="' + detect + '" media="screen" title="screen" />');

</script>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

JQuery add shadow error 4
Help with Visual Lightbox: Scripts 2
Help with code 0
Having difficulty with the layout of these images / video for this web page 2
Align img inside nav tabs section 5
Help with my responsive home page 2
How to position the *tooltip* comment on these buttons? 9
On-air script 0

Members online

Total: 20 (members: 1, guests: 19)
Robots: 367

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,020
Latest member
GenesisGai

Latest Threads

Top