Nombre de colonnes selon la largeur de l'écran (calcul) [Résolu]

[dancom5]

Bonjour.

Voir l'image pour vous donner une idée.

le raisonnement de mon problème à résoudre :

Code :

1
2
3
200px plus 100% du reste = 1024px (la résolution)
 
1024 - 200 = 824 = 100% du reste. (la portion contenant mes images)

Comment je peux déterminer nombre d'image selon la résolution de l'écran si mes largeurs de cellules sont de 130 px?

Peut etre en PHP ou javascript.

Bon temps des fêtes!

[NoSmoking]

Bonjour,
si tu veux optimiser le nombre d'images par ligne, tu vas vite te heurter aux différentes résolutions d'écran ainsi qu'a la gestion lors d'un redimensionnement de la fenêtre d'affichage.
Tu peux toujours essayer en utilisant comme unité le %.

[dancom5]

Le problème est que je dois indiquer à ma requête à LIMIT n,n un chiffre dynamique pour avoir le nombre par ligne qui s'ajuste automatiquement.

Code :

<?php $largeur = "<script><document.write(screen.width-200);</script>" ?>

quand je fais echo $largeur; ça indique bien 824 pixel. Mais si je mets ça dans autre chose qu'un simple écho, ça n'affiche rien du tout. :

Code :

echo '<table width="'.$largeur.'">';

Je me heurte à ce problème.

Le 824 + 200 = 1024

Je pourrais utiliser 824 dans la variable pour déterminer le nombre par ligne.

[Bovino]

Code php :

<?php $largeur = "<script><document.write(screen.width-200);</script>" ?>

Ca n'a aucun sens
PHP s'exécute coté serveur et JavaScript coté client, ce genre d'interaction est impossible !

[dancom5]

Pourtant, ça donne bien un résultat qui est 824.

Il doit surement y avoir quelque chose en PHP qui me permettrait d'exploiter le résultat. Voir même en javascript.

Un echo, ça marche mais pas en tant qu'utilisation en variable.

[Bovino]

Pourtant, ça donne bien un résultat qui est 824.

Reste ensuite à comprendre pourquoi...

Lorsque tu fais

Code php :

1
2
<?php $largeur = "<script><document.write(screen.width-200);</script>";
echo $largeur; ?>

Ta variable ne contient pas la largeur mais une chaine de caractères, qui lorsque tu l'affiches, ajoute le script dans la page, ce script sera donc interprété par le navigateur et le document.write() va effectivement afficher la valeur, mais $largeur n'a jamais contenu cette valeur.
Ensuite, quand tu fais

Code php :

echo '<table width="'.$largeur.'">';

tu affectes à la propriété width de la balise une chaine de caractères correspondant au script, ce qui est une aberration...

[dancom5]

J'ai trouvé la solution et elle fonctionne. La voici :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?php
if (isset($_GET['largeur']) AND isset($_GET['hauteur'])) {
  // Affichage des variables
  echo 'La largeur de l\'écran est : ' . $_GET['largeur'] ."<br />\n";
  echo 'La hauteur de l\'écran est : ' . $_GET['hauteur'] . "<br />\n";
} else {
  // passage des variables de dimensions
  // (préservation de la requête d'origine
  //   -- les variables par méthode POST doivent être traitées différemment)
 
  echo "<script type=\"text/javascript\">\n";
  echo "  location.href=\"${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}"
            . "&largeur=\" + screen.width + \"&hauteur=\" + screen.height;\n";
  echo "</script>\n";
  exit();
}
?>

source : http://php.net/manual/fr/faq.html.php

J'ai modifié pour mon cas :

Je mets ca dans mon fichier principal index.php à head.

Code :

1
2
3
4
5
6
7
8
9
10
11
12
<?php
if (isset($_GET['largeur'])) {
} else {
  echo "<script type=\"text/javascript\">\n";
  echo "  location.href=\"${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}"
            . "&largeur=\" + (screen.width-300);\n";
  echo "</script>\n";
  exit();
}
$ws = $_GET['largeur'];
$limit = intval($ws / 140);
?>

Je déduit 300 à cause de la colonne de gauche qui n'a rien avoir avec l'affichage des images. En réalité ma colonne à 200.

Je dois aussi enlever les flottants pour n'avoir que les entiers.

Donc pour avoir mon équivalent de 100% de ma section à droite, c'est à dire le reste, j'ai converti en pixel qui donne ici 824.

Les 4 images sont à 140 pixels. Mon seul hic est que 824 mets 5 au lieu de 4. Ce qui fait dépasser la cellule qui devient un peu plus grand à la résolution 1024. Je trouverai bien une solution à cela.

Je mets ensuite $limit dans la partie de ma requete mysql à LIMIT.
puis dans ma balise table $ws.

Ça marche bien et testé.

J'aurais voulu essayer avec la methode POST.

Je vais travailler le code pour l'améliorer encore.