Problème de crop avec php list et CSS

Fermé
Nomadique Messages postés 6 Date d'inscription vendredi 5 décembre 2014 Statut Membre Dernière intervention 11 juillet 2017 - 5 déc. 2014 à 20:00
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 - 9 déc. 2014 à 17:08
Mon client demande que les miniatures soit 'croppés' carré au centre de l'image.
Pour ce faire, j'utilise la commande PHP list et du css
Voici le code :
<?php
$sql_diapo=mysql_query("SELECT * FROM diapo WHERE categorie = '".$_GET['categorie']."' ORDER BY ordre ASC");
while($ligne_diapo=mysql_fetch_array($sql_diapo)){

// ================ CALCULER HAUTEUT ET LARGEUR ================
$laphoto="http://irenefw.com/media/photo/petit/".$ligne_diapo['id_diapo'].".jpg ";
$laphoto_g="http://irenefw.com/media/photo/grand/".$ligne_diapo['id_diapo'].".jpg ";

list($width, $height) = getimagesize($laphoto);

if($width > $height){ // paysage
$trop_large = $width - $height; //largeur moins hauteur
$coupe_large=$trop_large / 2; //resultat divisé par 2 (gauche-droite)
$largeur=$coupe_large / $width * 100; // en pourcentage
$largeur2=ceil($largeur); // arrondi
}
else{ // portrait
$trop_haut = $height - $width; //hauteur moins largeur
$coupe_haut=$trop_haut / 2; //resultat divisé par 2 (haut-bas)
$hauteur=$coupe_haut / $height *100; // en pourcentage
$hauteur2=ceil($hauteur); // arrondi à l'entier supérieur
}

echo "<div class=diapo>L:".$largeur2." H:".$hauteur2."<br><div style=' ";
if (isset($largeur2)){ echo "left: -".$largeur2."%;"; echo "right: -".$largeur2."%;";}
if (isset($hauteur2)){ echo " top: -".$hauteur2."%;"; echo " bottom: -".$hauteur2."%;";}

echo " '><a class=fancybox href=".$laphoto_g." data-fancybox-group=".$_GET['categorie']." title='".$ligne_diapo['legende']."'><img src=".$laphoto."></a></div></div>";
}

?>

Le crop se fait mais pas au centre de l'image et curieusement j'ai des images qui ont une valeur hauteur et largeur alors qu'il s'agit d'un else ???
On peut voir le résultat à http://irenefw.com/fr/portfolio.php?categorie=1
Il s'agit probablement d'un bête problème de logique mais je bloque dessus, vos suggestions seraient les bienvenus.
A voir également:

3 réponses

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 525
8 déc. 2014 à 11:19
Salut,

Une autre solution possible uniquement en css en utilisant les propriétés background-size et background-position (nécessite de remplacer les balises img par des div avec background-image). Exemple :
http://jsfiddle.net/283tss75/

Bonne journée
0
Nomadique Messages postés 6 Date d'inscription vendredi 5 décembre 2014 Statut Membre Dernière intervention 11 juillet 2017
8 déc. 2014 à 15:11
Merci Pitet, mais pour des raisons de référencement et de manipulation je ne veux pas utiliser "background".

merci quand même pour ta proposition,

Nomade
0
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 525
9 déc. 2014 à 17:08
En regardant un peu ton code, il semble que ton problème vient de l'utilisation de isset() sur des variables initialisées à l'intérieur de ta boucle.

En effet, au premier tour de boucle uniquement une seule des 2 variables $largeur2 et $hauteur2 est définie (en fonction de la première image).
Mais dès qu'une de ces 2 variables est initialisées, elle le reste pour les prochains tour de boucle.

La solution la plus simple pour ne pas modifier ton code est de supprimer ces 2 variables au début de chaque tour de boucle, soit :
while($ligne_diapo=mysql_fetch_array($sql_diapo)){
    unset($largeur2);
    unset($hauteur2);


Bonne journée
0