CSS en fonction de la définition de l'internaute
- Auteur de la discussion OTP
- Date de début
WRInaute discret
e-kiwi le tout à la fois :lol:
Je pense automatiquement!
Je pense automatiquement!
OTP a dit:
Si je peux me permettre, ça ne me paraît pas une bonne idée. D'abord parce qu'il y a plus de résolutions possibles que tu ne peux le penser, du 640x480 au 1920x1200 en passant par tout un tas d'autres formats, ensuite parce que résolution d'écran et taille de fenêtre sont deux choses bien différentes, mais aussi parce que tout le monde n'a pas le même réglage de "résolution" (en ppp/dpi), en particuliers sur le écrans avec des résolutions un peu sympa sur lesquels 1px != 1pt...
Sérieusement, quel est vraiment l'intérêt?
Jacques.
WRInaute accro
OTP a dit:
Le plus simple reste quand même de revoir tes templates de façon à ce qu'ils soient étirables.
WRInaute accro
OTP a dit:
C'est un choix aussi.
Ce que tu peux faire, c'est mettre en place un script qui test un certain nombre de réso et affiche le contenu en fonction, et proposer un affichage par défaut dans un cas qui ne serait pas pris en compte.
http://www.commentcamarche.net/faq/sujet-849-php-detecter-la-resolution-d-affichage
Mais il y aura forcément des laissés pour compte.
non pas besoin de rechargement de page, car tu peux charger une css en javascript (ou ajax). il te suffit donc de detecter la résolution en js, et de charger la bonne css, et hop, pas de rechargement de page. attention par contre a bien définir tes css, car si tu as un background sur une, et que tu charge l'autre, si tu oublie de mettre background:transparent il va te rester le background de l'autre css
un exemple tout fait avec prototype :
http://www.gallenne.fr/javascript/charg ... quement-16
un exemple tout fait avec prototype :
http://www.gallenne.fr/javascript/charg ... quement-16
OTP a dit:
Prend garde à une erreur potentielle...
J'ai eu utilisé ce procédé dans le passé. Si je puis me permettre un conseil, il te faut trouver la largeur de la fenêtre du navigateur et non celle de la résolution qui peut être différente.
De plus, suivant les navigateur, il faut compter x pixels pour les barres de scroll.
Bref !
Bien plus de problème qu'un site adaptable à toutes résolution.
Pour ma part, j'ai fait en sorte que mon site soit visible en 800 × 600 :
La largeur minimum du contenu passe dans la largeur 800 ; la largeur minimum contenu + navigation passe en largeur 1024
En déplaçant la barre de scroll à droite, on à accès à tout le contenu pour le 800 × 600, la navigation se trouvant sur la gauche ; un bon compromis quand on sait que cette résolution est en voie de disparition.
De la même manière, la largeur et la hauteur maxi de mes images à été calculée en fonction de cette résolution.
Je reste donc accessible pour toutes les résolutions sans trop de soucis ; bien moins qu'avec mon ancienne méthode qui prenait en compte la résolution
Nouveau WRInaute
youhouu, bonsoir,
C'est exactement se que j'éssaie en vain de faire ,perso je voudrais changer l'image de mon header selon la taille de la fenetre du navigateur
en passant par un chragement css.
Pour l'instant j'arrive a le faire avec un code javascript qui détecte la resolution, mais il serait bien plus judicieu
de détécter la taille de la fenetre et de charger un css en fonction car la il ya des resolution 1920x1080 sur des 19pouces et la ca fais mal
!
Si il y a la moindre piste, je suis preneuse
Merci a ceux qui éssaieront de maider,
Jessicat
C'est exactement se que j'éssaie en vain de faire ,perso je voudrais changer l'image de mon header selon la taille de la fenetre du navigateur
en passant par un chragement css.
Pour l'instant j'arrive a le faire avec un code javascript qui détecte la resolution, mais il serait bien plus judicieu
de détécter la taille de la fenetre et de charger un css en fonction car la il ya des resolution 1920x1080 sur des 19pouces et la ca fais mal
!Si il y a la moindre piste, je suis preneuse
Merci a ceux qui éssaieront de maider,
Jessicat
Nouveau WRInaute
detecter la taille de la fenetre et redimensionner a la vollé avec php avec
document.getElementById('id').offestHeight
et
document.getElementById('id').offestWidth
mais je n'y arrive pas encor donc si kelkun à déja vu ca..
document.getElementById('id').offestHeight
et
document.getElementById('id').offestWidth
mais je n'y arrive pas encor donc si kelkun à déja vu ca..
Salut OTP,
salut tout le monde,
au cas où tu n'aurais pas trouvé ton bonheur...
Pour mon site (wa1pdesign.fr - remplacer le "1" par un "i"), j'ai bricolé ce petit code :
J'espère que ça pourra t'aider...
salut tout le monde,
au cas où tu n'aurais pas trouvé ton bonheur...
Pour mon site (wa1pdesign.fr - remplacer le "1" par un "i"), j'ai bricolé ce petit code :
Code:
var content = document.getElementById('accueil');
var hauteur_page;
var hauteur_div;
var largeur_div;
// détection IE6
var IE6 = false
var strChUserAgent = navigator.userAgent;
var intSplitStart = strChUserAgent.indexOf("(",0);
var intSplitEnd = strChUserAgent.indexOf(")",0);
var strChMid = strChUserAgent.substring(intSplitStart, intSplitEnd);
//
if( typeof( window.innerWidth ) == 'number' ) {
hauteur_page = window.innerHeight;
hauteur_div = content.offsetHeight;
largeur_div = content.offsetWidth;
}
else if( document.documentElement && document.documentElement.clientHeight ) {
hauteur_page = document.documentElement.clientHeight;
hauteur_div = content.offsetHeight;
largeur_div = content.offsetWidth;
}J'espère que ça pourra t'aider...
Discussions similaires
