Redirection de page en fonction de la taille de l'image
Résolu
DADYY87
-
DADYY87 -
DADYY87 -
Bonjour,
Je souhaite faire une redirection de la page lorsque l'image est de la taille suivante : 120x120 ou inférieure.
J'ai essayé de le faire de la manière suivante pour tester :
Sauf que la redirection lorsque l'image est à 120 ne se produit pas...
Je ne sais pas comment faire, si quelqu'un peut m'aider svp ?
Je souhaite faire une redirection de la page lorsque l'image est de la taille suivante : 120x120 ou inférieure.
J'ai essayé de le faire de la manière suivante pour tester :
function getwidth(){
var img = document.querySelector("#myImg");
var width = img.clientWidth;
}
function getheight(){
var img = document.querySelector("#myImg");
var height = img.clientHeight;
}
// Redirection de page en fonction de la taille de l'ecran
if (screen.width <= 560 || getwidth() <= 120 && getheight() <= 120){
window.location.replace("https://www.ccb81.fr/embauche/resize_img.php");
}
<img src="https://www.calguns.net/images/120x120/blue120x120.gif" id="myImg">
Sauf que la redirection lorsque l'image est à 120 ne se produit pas...
Je ne sais pas comment faire, si quelqu'un peut m'aider svp ?
A voir également:
- Redirection de page en fonction de la taille de l'image
- Comment réduire la taille d'un fichier - Guide
- Impossible de supprimer une page word - Guide
- Fonction si et - Guide
- Reduire taille image - Guide
- Frédéric cherche à faire le buzz sur les réseaux sociaux. il a ajouté une image de manchots sur une image de plage. retrouvez l'image originale de la plage. que cachent les manchots ? ✓ - Forum Windows
3 réponses
Salut,
les fonctions ne retournant aucune valeur le problème doit être là.
Voir la portée des variables en JavaScript.
Un simple test avec console.log vous aurait montré que les fonctions ne retournent aucune valeur.
Sinon pour utiliser les variables en "globales" on peut faire comme ceci, mais c'est moins pratique il me semble ici:
les fonctions ne retournant aucune valeur le problème doit être là.
Voir la portée des variables en JavaScript.
Un simple test avec console.log vous aurait montré que les fonctions ne retournent aucune valeur.
function getwidth(){
return document.querySelector("#myImg").clientWidth;
}
//--ou mieux
function getImgWidth(selector){
return document.querySelector(selector).clientWidth;
}
//--
console.log(getImgWidth("#myImg"));
Sinon pour utiliser les variables en "globales" on peut faire comme ceci, mais c'est moins pratique il me semble ici:
var width;
function loadWidth(){
width=document.getElementById('myImg').clientWidth;
}
loadWidth();
console.log(width);
console.log('équivaut à : '+window.width);
Merci pour ton aide Automaton !! J'ai enfin réussi à faire ma condition cependant j'ai de nouveau un autre problème et je suis un peu dans l'incompréhension...
Lorsque je mets à présent n'importe quelle image c'est a dire une image qui dépasse la dimension que j'avais donné dans ma condition la redirection continue à se faire... Or ce que je souhaite avoir c'est faire ma redirection que si l'image est en dessous de 120 x 120 sinon rester sur ma page actuelle...
Voici le code :
J'espère ne pas être flou dans mes explications...
Lorsque je mets à présent n'importe quelle image c'est a dire une image qui dépasse la dimension que j'avais donné dans ma condition la redirection continue à se faire... Or ce que je souhaite avoir c'est faire ma redirection que si l'image est en dessous de 120 x 120 sinon rester sur ma page actuelle...
Voici le code :
<div class="text-center">
<!-- bandeau de presentation de la page-->
<h2 style="text-align: center;" class="grosseur">Cadrage de la photo</h2>
<figure class="figure">
<?php echo'<img class="img" src="./img_tmp/'.$user_id.'-identite.'.$ext.'" id="cropbox"/>' ?>
</figure>
var width;
function getwidth(){
width = document.getElementById("cropbox").clientWidth;
}
getwidth();
var height;
function getheight(){
height = document.getElementById("cropbox").clientHeight;
}
getheight();
// Redirection de page en fonction de la taille de l'image
if ( width <= 120 && height <= 120 ) {
window.location.replace('https://www.test/resize_img.php?extension=<?php echo ($ext);?>');
}
J'espère ne pas être flou dans mes explications...
