2010-07-22 6 views
1

Je charge une image d'arrière-plan dans un div. Est-il possible d'obtenir les dimensions de cette image?Obtention de cotes depuis background-image en utilisant jQuery

J'essaye de faire une fonction qui remplacera le texte avec des images à la volée, pour l'usage dans le menu.

$.fn.MenuImages = function() { 
    return this.each(function(i) { 
    var name = $(this).find('a').attr('title'); 
    $(this).css("background-image","url(images/menu-"+name+"-h.png)"); 
    }); 
}; 

Le problème est que les images n'ont pas toutes la même taille. Je ne suis pas sûr de savoir comment lire les dimensions du fichier, sauf si je le charge dans un div caché ou quelque chose, mais cela semble si sale. Des recommandations? Merci!

fixe:

$.fn.MenuImages = function() { 
return this.each(function(i) { 
    var link = $(this).find('a'); 
    var name = link.attr('title'); 
    link.html("<img src='images/menu-"+name+"-h.png' />"); 
}); 

};

+0

Pourquoi utilisez-vous des images de fond? Êtes-vous en mesure de fournir une URL où nous pouvons voir ce que vous essayez? – Lazarus

+0

Malheureusement, vous ne pouvez pas obtenir la dimension d'une image à partir de la propriété d'arrière-plan CSS. Je pense que votre solution sale est le seul moyen. – Pat

+0

Lazare, vous avez absolument raison. haha, n'a pas pensé à ça. C'est ça, pas besoin de chèques css. –

Répondre

3
​$('<img src='images/menu-"+name+"-h.png' />')​.attr('src',function(){ 
    return $('body').css('background-image'); 
})​​​.load(function(){ 
    w = $(this).width(); 
    h = $(this).height(); 
})​; 

Ceci attend que l'image soit chargée pour saisir la hauteur d largeur.

+0

J'ai essayé ceci, mais $ (this) .width() renvoie toujours 0. –

+0

Mais this.naturalWidth renvoie la valeur correcte. –

1
var img=new Image(); 
img.onload=function(){ 
    alert(img.width); 
    alert(img.height); 
}; 
img.src="image.png"; 
0

Jquery

w = $("img").width(); 
h = $("img").height(); 

Ruby

IO.read('image.png')[0x10..0x18].unpack('NN') 

Cela donne un tableau [largeur, hauteur] que vous pouvez extraire une [0] pour la largeur etc ...

Questions connexes