Je veux trouver la largeur totale d'un SPAN qui entoure plusieurs lignes. Est-ce possible? Il s'agit d'un seul tag SPAN, sans aucun autre nœud interne ...Largeur totale d'un élément en ligne enveloppant
Si ce n'est pas possible, je préférerais ne pas trouver les décalages de pixels gauche et droit du début et de la fin du SPAN.
vous voulez trouver la largeur de pixel d'un bloc de texte si c'était une ligne?
Je pense que ce que vous pourriez être capable de faire (et que quelqu'un rejettera cela pour avoir tort) est d'utiliser javascript pour configurer un autre span dans un autre div de la page (par exemple style = "top: -500px;") , prenez le 'innerHTML', déposez le dans la partie cachée, prenez la largeur du div contenant, puis courez avec ça.
Je prédis problèmes de navigateur croix et chagrin d'amour
<html>
<head>
<script>
function getSpanWidth(spanID){
sourceSpan=document.getElementById(spanID)
targetSpan=document.getElementById("spanmeasure")
targetSpan.innerHTML=sourceSpan.innerHTML
alert(targetSpan.offsetWidth+" "+sourceSpan.offsetWidth)
}
</script>
<style>
div{border:1px solid #cc0000;}
</style>
</head>
<body onLoad="getSpanWidth('spantext')">
<div style="width:100000px; top:-1000px;position:absolute;"><span id="spanmeasure"></span></div>
<div style="width:200px;">
<span id="spantext"> span text goes here, and then if there is lots and lots it will wrap around and be awesome! I'll put in more text to awesome it out even more... Awesome!
</span>
</div>
</body>
</html>
cela semble fonctionner sur IE7 et ff. Vous obtiendrez une variation si vous n'utilisez pas un style de remise à zéro (parce que les polices par défaut sont différentes)
également, si vous définissez display: none, la largeur sera 0.
Vous devez appeler getClientRects . Vous obtiendrez un tableau de rectangles de ligne et pourrez ajouter la largeur.
QuirksMode a un nice demo.
var element = document.getElementById('someSpan');
var elementWidth = element.offsetWidth;
Aucune idée si c'est ce que vous demandez vraiment, mais cela vous donnera la largeur de la durée. Edit: Après avoir lu votre question 3 fois plus, je suis sûr que ce n'est pas ce que vous demandez.
HI, Je pense que vous pouvez le faire en utilisant getBoundingClientRect fonction.
var leftPosition = yourElement.getBoundingClientRect().left;
var rightPosition = yourElement.getBoundingClientRect().right;
var topPosition = yourElement.getBoundingClientRect().top;
var bottomPosition = yourElement.getBoundingClientRect().bottom;
Je ne sais pas si vous êtes à la recherche de ceci ou non.
Essayer de comprendre, largeur totale = largeur ligne 1 + largeur ligne 2 + etc? De même, décalages gauche et à droite par rapport à (son conteneur, la fenêtre)? –