J'essaie d'obtenir le CSS (haut et gauche d'un élément) avec jQuery: mais au lieu de "12%" comme il devrait être, je reçois les pixels. de html:
Comment puis-je obtenir le pourcentage?
7 Réponses :
Calculez-le par vous-même:
($(element).css('top') / parentHeight) * 100;
ne fonctionne pas, ($ (élément) .CSS ("haut"). substr (0, $ (theobj) .CSS ("haut"). Longueur-2) / $ (élément) .Parente (). Hauteur ( )) * 100; me donne nan (la hauteur du parent est 0)
Qu'en est-il de parseint ($ (élément) .CSS ("haut"))
Vous pouvez le faire:
$(element).position().top / $(element).parent().height() * 100
Comme je l'ai mentionné auparavant, la hauteur du parent retourne 0
La hauteur du parent devient 0 si vous utilisez du flotteur ou une position: [Absolute | fixe] dessus.
-1: Obtenir la valeur réelle au lieu de calculer que ce serait une meilleure pratique. - élément.style.top
Oh 3 ans après ma réponse, obtenez toujours des commentaires: d. En fait, OP a demandé un moyen d'obtenir un pourcentage avec jQuery. J'ai répondu en disant le calculer (de sorte que vous êtes sûr à 100% d'avoir un pourcentage). Mais je conviens que si vous avez besoin d'obtenir la valeur directement à partir des styles ollement.style.top est un meilleur moyen;)
J'avais besoin de calculer quelque chose de similiaire mais dans mon cas, c'était le% de gauche, vous pouvez mettre à jour le code ci-dessous pour utiliser la hauteur de la fenêtre si vous allez pour une valeur de pourcentage verticale -
getLeftPercent = function() {
var leftStr = $('#my-obj').css('left'),
pxPos = leftStr.indexOf('px'),
leftVal = leftStr.substr(0, pxPos),
leftPercent = (leftVal / $(window).width() * 100).toString(),
dotPos = leftPercent.indexOf('.'),
leftPercentStr = dotPos == -1 ? leftPercent + '%' : leftPercent.substr(0, dotPos) + '%';
return leftPercentStr;
};
Je viens de le rencontrer moi-même et je le crois aussi bizarre aussi.
au lieu de: i juste fait: pas de jQuery et vous donne la valeur réelle dans le type que vous avez faite (pour cent, EMS, etc.)
Ceci est définitivement plus utile que de prendre la hauteur du parent, puis de l'ingénierie inverse pour calculer le pourcentage.
Il y a une façon (très facile) de faire ça! voila! p> Si vous voulez juste le numéro sans Le "%" Utilisez P>
Même lors de l'utilisation de feuilles de style.
La clé est d'empêcher JQUERY de calculer la valeur en caché temporairement le parent. strong> top = parseFloat(top);
Ceci est également une option:
$(element)[0].style.top
Vous pouvez essayer ceci. Vous pouvez modifier l'élément "et" parent "pour être compatible avec votre projet.
var parent_height = $(element).parent().height(); // Height of parent. If you do something related to "width", get parent's width.
var top_val_px = $(element).css('top');
var top_val_only = top_val_px.slice(0,-2); // Remove "px" part
var top_Percentage = (top_val_only/parent_height) * 100; // Percentage will be a close value.
Pouvez-vous montrer votre HTML et CSS pour l'élément? Dans l'exemple suivant, je reçois le% jsfiddle.net/nalum/ymtvv bien que je n'ai que testé Ceci dans Google Chrome. Quel navigateur utilisez-vous?