1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32
|
// Fonction qui va permettre de centrer les images dans leur case
function centerImages(event) {
// Cette fonction se déclenche quand une image a été déposée au bon endroit
var plateau = document.getElementById('plateau');
var iddiv = event.target.getAttribute('id'); // On sélectionne la cible de notre évènement, qui est la case où la pièce est déposée
// On parcourt notre tableau pour voir quelle est notre image que l'on dépose
for ( var i = 0; i < nbImages; i++ ) {
if (iddiv == tabDrop['id_case'][i]) {
// Quand on a découvert la colonne de notre tableau qui contient les infos sur l'image déposée
idimg = 'img'+i; // On prend l'id de notre image
img_src = tabDrop['src_image'][i]; // son adresse
img_hauteur = tabDrop['hauteur'][i]; // sa hauteur
img_largeur = tabDrop['largeur'][i]; // sa largeur
img_marginTop = tabDrop['positionY'][i]; // sa position-top
img_marginLeft = tabDrop['positionX'][i]; // sa position-left
}
}
// On la positionne au bon endroit sur la case, en son centre, en se référant aux coordonnées de la case
("#idimg").css({
position : 'absolute',
marginLeft : img_marginLeft + 'px',
marginTop : img_marginTop + 'px'
});
var img = document.getElementById(idimg); // On selectionne notre image grace a son id
plateau.appendChild(img); // On rajoute notre image au plateau
} |
Partager