Bonjour,
Voilà mon problème, j'ai une lightbox que j'affiche, dans cette lightbox j'ai une image qui se charge.
J'ai une fonction javascript qui me permet de centrer le div correspondant à lightbox automatiquement en fonction des tailles de cette lightbox. Voici son contenu :
Code Javascript :
function centrerDiv(divId) {
var margeLeft = $("#" + divId).width() / 2;
var margeTop = $("#" + divId).height() / 2;
$("#" + divId).css({ "top": "50%", "left": "50%", "margin-left": "-" + margeLeft + "px", "margin-top": "-" + margeTop + "px" });
}J'appel cette fonction centrerDiv dans ma page lightbox :
Code Javascript :
<script type="text/javascript">
$(document).ready(function() {
centrerDiv("boxNouvelle");
});
</script>
Le problème est que lorsque la function centrerDiv est executée, l'image n'est pas forcement encore chargée, donc il centre en fonction de la taille actuelle du div, et pas la taille finale du div, du coup elle n'est pas bien centrée une fois l'image chargée.
Ma question est donc, comment faire pour appeler ma function seulement apres que mon image soit chargée
nb: la source de l'image est initialisé dans le code behind de ma page, donc je ne peux pas faire de
Code Javascript :
var monImageJS = new Image;
monImageJS.onload = function(){
document.getElementById('monImageDOM').src = monImageJS.src;
centrerDiv("boxNouvelle");
}