Bonjour,
Je cherche depuis quelques jours, sans succès comment sélectionner la bonne feuille de style en fonction de si c'est un mobile ou un PC qui se connecte.
J'ai pensé mettre les balises HTML de sélection de la feuille CSS en fonction des pixels de l'écran, et à la place du href="style.css", mettre href"<? CODE PHP ?>. Mais bien sur, cela n'a pas l'air de fonctionner... (Le code PHP est d'abord exécuté, avant le HTML )..
Je vous joint le fichier "header.php" que j'inclus sur presque toutes les pages :
Si je parviens à récupérer dans une variable session, la feuille de style utilisée, j'espère par la suite pouvoir proposer sur la page principale par exemple, de changer de feuille de style selon les désirs du visiteur...
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44 <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/heure.js"></script> <!-- TEST pour le switch via lien --> <script type="text/javascript" src="styleswitcher.js"></script> <?php // Si 'CSS' n'existe pas, on le créé if(!isset($_SESSION['css'])) { // On définit le CSS PC de base $_SESSION['css'] = 'style' ; } // On test ensuite avec le code HTML pour confirmer si on prend le 'PC' ou le 'mobile' ?> <!-- Configurer la variable SESSION avec le bon CSS : 'style_1280px' = Mobiles - 'style' = PC --> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- On veut connaitre les dimensions de l'écran --> <link rel="stylesheet" media="only screen and (max-width: 734px)" href="<?php $_SESSION['css'] = 'style_1280px'; ?> /> <link rel="stylesheet" media="only screen and (min-width: 735px)" href="<?php $_SESSION['css'] = 'style' ; ?> /> <?php // DEBUG echo "<br/>fichier choisi :".$_SESSION['css']."css<br/>"; // On test ensuite la valeur de la variable 'css' if($_SESSION['css'] == 'style_1280px') { // DEBUG echo "<br/>apres test, CSS pour mobile appliqué<br/>"; // On utilise alors le 'style_1280px' pour les mobiles ?><link href="style_1280px.css" rel="stylesheet" type="text/css"><?php } else // Alors c'est que ce n'est pas un mobile, on utilise le 'style' { // DEBUG echo "<br/>apres test, CSS pour PC appliqué<br/>"; ?><link rel="stylesheet" href="style.css" type="text/css"/><?php } ?> <link rel="icon" type="image/ico" href="images/favicon.ico" /> <div class='banniere'></div>
Le fait de passer par le PHP devrait donc être plus simple, mais pour le moment j'ai du mal, ça ne marche pas et je ne comprend pas comment faire..
Merci :-)
Partager