2010-12-02 4 views
2

aide définitive me s'il vous plaît si vous voulez bien ...Varier CSS stylesheet selon la taille de la fenêtre du navigateur - Je ne trouve rien

J'ai du mal à repérer la meilleure façon de s'y prendre, car le nouvel algorithme de Google n'est pas très utile avec mes termes de recherche (sur place).

My site est 100% de largeur de fluide et j'ai besoin de changer les feuilles de style pour les utilisateurs à 1152/1024 et ci-dessous. J'ai commencé avec le morceau suivant de jscript pour détecter la résolution et appliquer ces nouvelles feuilles de style, mais cela ne fonctionne pas dans IE - juste génial. Je comprends qu'une feuille de style basée sur la fenêtre du navigateur réel est la meilleure, mais le contenu a une largeur maximale de 1280px, donc les résolutions énormes avec les fenêtres minimisées ne seront pas affectées, je l'espère, et je doute que les utilisateurs minimiser leurs fenêtres si elles sont sur des résolutions sur 1024 et ci-dessous.

Voici mon code actuel placé dans la tête:

<script type="text/JavaScript"> 
var screenwidth = screen.width; 
if (screen.width < 1280){ 
document.write('<link rel="stylesheet" href="/Assets/Templates/Common/Public/1024res.css" type="text/css" media="screen" />'); 
} 
</script> 

Alors, mes questions sont les suivantes: 1) Pourquoi pas ce travail dans IE? Et 2) Est-ce le meilleur itinéraire, surtout si jscript est désactivé? Est-ce que quelqu'un sait comment faire pour y parvenir?

Toute aide - très appréciée!

Répondre

5

La méthode non-javascript:

<link rel="stylesheet" media="screen and (min-device-width: 1152px)" href="800.css" /> 

Voir: http://css-tricks.com/resolution-specific-stylesheets/

+0

Merci pour le commentaire - J'ai essayé et il ne fonctionne pas dans IE soit! Des idées pourquoi ?? Merci :) – Sue

+0

Quelle version d'IE? –

+0

IE 8 .. Ne peut tout simplement pas fonctionner! D'autres suggestions? Je suis désespéré de faire ce travail ... les utilisateurs rebondissent comme je tape et j'ai essayé quelques-uns, mais jusqu'à présent rien ne fonctionne cross-browser – Sue

Questions connexes