[CSS/javascript] + Browser détector

[ViriisXP]

Bonjour à tous,

je vous expose mon soucis, je construit un site, conforme au norme xhtml transitionnel (pas encore au strict) .

J'ai mis à disposition un systeme sur le site permettant le changement de skins (affichages pour ceux qui savent pas)

le code est celui çi :

 <form action="/switch.php" method="post">
<!-- vous pouvez choisir d'utiliser la méthode GET, le fonctionnement en sera le même -->

  <select name="style">
<option value="<?php echo $css1; ?>"<?php if ($_COOKIE['feuilleStyle'] == '<?php echo $css1; ?>') { echo ' selected="selected"'; } ?>>Style simple</option>
<option value="<?php echo $css2; ?>"<?php if ($_COOKIE['feuilleStyle'] == '<?php echo $css2; ?>') { echo ' selected="selected"'; } ?>>Style black-teck</option>
<option value="<?php echo $css3; ?>"<?php if ($_COOKIE['feuilleStyle'] == '<?php echo $css2; ?>') { echo ' selected="selected"'; } ?>>Style White-teck</option>
  </select>
  <input type="hidden" name="redirection" value="http://<?=htmlspecialchars($_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'])?>" />
  <input type="submit" value="Changer" />

</form>

Bon il fonctionne parfaitement, mais j'ai découvert que mes css ne sont pas du tout correct sous ie , les décalages de M***** du fait qu'il ne comprenne pas les normes .... etc ...

Aussi j'ai décider de mettre un browserdetector en javascript (.js), j'ai découvert ce code :

<script type="text/javascript">
var nomnav = navigator.appName;
if (nomnav == 'Microsoft Internet Explorer') {
 document.write("<link rel='stylesheet' media='screen' type='text/css' href='styles_ie.css'>");
}
else {
 document.write("<link rel='stylesheet' media='screen' type='text/css' href='styles.css'>");
}
</script>

Bon le soucis est qu'il me faut afficher dans mon form le choix des skins en fonction aussi de ie .

je m'explique ce que je souhaite faire :

Quand un utilisateur sous firefox ou opera ou autre .... viens sur le site le browser détector affiche le templates par défault, et si il choisi dans le menu déroulant je souhaite que le menu ne lui affiche que les skins générique.....(pas pour ie).

Et quand un utilisateur IE viens sur le site .... le browserdetector lui affiche la skin par défault spécial IE , et quand il ouvre le menu des skins , que seul les skins créer spécialement pour IE lui soit proposer.

dossier des templates au final :

-basic.css
-black.css
-white.css
-basic_ie.css
-black_ie.css
-white_ie.css

comment doit-je faire ?

svp aidez moi ....

[theocrite]

Tu as des balises pour ça.

Un truc du genre [--ifIE] ou un truc dans le genre, je ne me souviens plus.

[ViriisXP]

nan, le truc c'est que je veux savoir le code que je peux utilisé , mais un code valid w3c aussi ;s

edit : en fait par exemple pour le menu de choix je pense que ca doit pas etre dur un petit if et else mais if quoi et else koi lol ^^ :)

car aprés pour le browser detector ben je modifier pour que sous ie le style meme si il as déja été choisi au cours d'une autre visite ai le _ie.css en fait , je pense pas que ce sera dur , mais bon c'est pour le menu moi que ca me dérange ^ :)

[windu.2b]

Si j'ai bien compris, tu veux ne proposer que les styles gérables par le navigateur de l'internaute?

Si c'est ca, tu dois pouvoir ajouter/retirer des <option> d'un <select> via JavaScript et/ou css (faut faire mumuse avec le DOM en fait).

Une solution envisageable serait de mettre un style css pour les <option> proposant un skin IE et un autre style CSS pour les autres <option>, et le CSS (via un appel JavaScript qui l'applique à la volée, pourquoi pas) rend 'hidden' les styles qu'il ne faut pas... A tester, car je ne suis pas sûr du tout de ce que je te propose

[SyGEN]

Et pourtant Theocrite à raison. Nul besoin de passer par du javascript pour faire ca.

Utilises les Commentaires Conditionnels

Typiquement (exemple simplifié):

<!--[if lte IE 6]>
<select name="style">
 <option value="<?php echo "css_ie1.css";?>">Css1</option>
</select>
<![endif]-->

<!--[if !IE]> <-->
<select name="style">
 <option value="<?php echo "css_1.css";?>">Css1</option>
</select>
<!--> <![endif]-->

Meme chose au niveau du <head> pour les stylesheets.

[ViriisXP]

oué j'ai trouver pendant la nuit en fait :

<?php 
if (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE') !== FALSE)
{
// IE
echo $stylesheets_ie;
}
else
{
// Autre
echo $stylesheetsothers;
}
?>

et les stylesheets :

$stylesheets_ie = '<link rel="stylesheet" type="text/css" media="screen" title="Style de l\'utilisateur" href="'  . (isset($_COOKIE['feuilleStyle']) ? htmlspecialchars($_COOKIE['feuilleStyle']) : 'basic_ie') . '.css" />';
$stylesheetsothers = '<link rel="stylesheet" type="text/css" media="screen" title="Style de l\'utilisateur" href="'  . (isset($_COOKIE['feuilleStyle']) ? htmlspecialchars($_COOKIE['feuilleStyle']) : 'basic') . '.css" />';

enfin voilà merci en tout cas de l'aide ^^

[theocrite]

Sauf que le user agent ça se spoofe...

[ViriisXP]

oui par xxs mais pas comme j'ai fait , le xxs ca passe pas ....

aprés oui je sais certain navigateur peuvent se faire passer pour d'autre mais bon , pour l'instant çà me suffira , mais je vais étudier le lien que vous m'avez donner

[theocrite]

xxs ?

[windu.2b]

oui par xxs mais pas comme j'ai fait , le xxs ca passe pas ....

aprés oui je sais certain navigateur peuvent se faire passer pour d'autre mais bon , pour l'instant çà me suffira , mais je vais étudier le lien que vous m'avez donner

kézako xxs?

Sinon oui, certains navigateurs se font passer pour IE (c'est, ou c'était, le cas d'Opéra)! Et donc ca risque de poser un pb...

LA solution: que tous les navigateurs respectent les recommandations du W3C!

Ouais, en fait, fais un hack, ca marchera bien avant que IE soit respectueux

[ViriisXP]

pardon je voulais dire xss ^^

je me suis gouré dans l'abréviation ^^