1 pièce(s) jointe(s)
Découpage images et adaptation suivant le bloc
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. Pièce jointe 190545
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
Code:
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> |
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:
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%';
} |
maintenant, je dois trouver une solution comment recuperer l'hauteur et largeur de image pour mettre dans le scoop : pour etre dynamique pas statique.
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
