Bonjour,
Je suis entrain de faire un projet sous angular js.
Maintenant, je suis entrain de faire l'optimisation des images (galerie photo).
si j'ai une image plus grand en hauteur, On fait le couper en haut et en bas.
Si l'image est plus grand en largeur, on fait le couper à droite et à gauche voir pièce jointe.
voila que j'ai fait:
1. J'ai fixé fixer le bloc d'insertion des 10 images ( l'hauteur et la largeur) pour tous les devices : comme j'ai noté dans le deriner email. coté css)
2. pour chaque bloc cad pour chaque image j'ai ajouté à chaque bloc un background cad celle de limages on doit afficher que la partie qu'on a ficé normalement dans controlleurs (js): coté html
3. pour le controleurs: j'ai testé le travail par exemple si la largeur est plus grand que l'hauteur ou le contraire je trouve une resultat bonne mais statiquement j'ai fais
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6 <div class="galeryProfilBusiness"> <div class="item jq-item-sz" ng-repeat="im in userprofile.profile.images" ng-class="{active : $first}" ng-click="openGallery(userprofile.profile.images)" ng-style="{'background': 'url(<a href="http://www.exemple.com/api/picture/'+im+" target="_blank">http://www.exemple.com/api/picture/'+im+</a>') no-repeat center transparent', 'background-size': ''+x+' '+y+''}"> </div> </div>
maintenant, je dois trouver une solution comment recuperer l'hauteur et largeur de image pour mettre dans le scoop : pour etre dynamique pas statique.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12 //decoupage image var larg= 500; // des valeurs statiques var haut= 100; if (larg> haut*2) { $scope.x='10%'; // c'est juste exemple $scope.y='11%'; } else{ $scope.x='20%';// c'est juste exemple $scope.y='21%'; }
càd avant de l'afficher sur l'ecran car en réeel l'image dans le controleurs c'est come si une chaine de caractere pas une image pour trouver la largeur et l'hauteur
Ma question: si vous avez une methode pour savoir la largeur et l'hauteur de image avant l'upload.
merci de me repondre
Partager