CSS style sheets are automatically called based on different browsers and resolutions. This is implemented using jscript. The following code is used:
| The code is as follows: |
Copy code |
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Title> automatically calls codes of different CSS based on the browser-type screen resolution </title>
<Link href = "" _ fcksavedurl = "rel =" stylesheet "type =" text/css "/>
<Script language = "jscript">...
If (window. navigator. userAgent. indexOf ("MSIE")> = 1)
...{
Var IE1024 = "style1.css ";
Var IE800 = "style2.css ";
Var IE1152 = "css1.css ";
Var IEother = "css1.css ";
ScreenWidth (IE1024, IE800, IE1152, IEother)
} Else ...{
If (window. navigator. userAgent. indexOf ("Firefox")> = 1)
...{
// If the browser is Firefox
Var Firefox1024 = "style1 ";
Var Firefox800 = "style2.css ";
Var Firefox1152 = "css1.css ";
Var Firefoxother = "css1.css ";
ScreenWidth (Firefox1024, Firefox800, Firefox1152, Firefoxother)
} Else ...{
// If the browser is other
Var Other1024 = "css1.css ";
Var Other800 = "css1.css ";
Var Other1152 = "css1.css ";
Var Otherother = "css1.css ";
ScreenWidth (Other1024, Other800, Other1152, Otherother)
}
}
Function ScreenWidth (CSS1, CSS2, CSS3, CSS4 )...{
If (screen. width = 1024) & (screen. height = 768 ))...{
SetActiveStyleSheet (CSS1 );
} Else ...{
If (screen. width = 800) & (screen. height = 600 ))...{
SetActiveStyleSheet (CSS2 );
} Else ...{
If (screen. width = 1152) & (screen. height = 864 ))...{
SetActiveStyleSheet (CSS3 );
} Else ...{
SetActiveStyleSheet (CSS4 );
}}}
}
Function setActiveStyleSheet (title)... {document. getElementsByTagName ("link") [0]. href = "" + title ;}
</Script>
</Head>
<Body>
</Body>
</Html> |
