Taille d'un texte en pixelFermé

Question

Bonjour,

J'ai créé un programme qui me permet d'écrire sur une image 2 textes. Cette page est composé d'un formulaire comportant toute les variables (ou presque) dont j'ai besoin soit pour chaque texte : le contenue du texte en lui même, les coordonnées y et x du texte et sa taille. Il y a aussi le format utilisé commun au 2 textes. A coté du formulaire, se trouve l'image généré grâce à  GD. Des qu'un champs du formulaire est modifié, je réactualise l'image grâce à javascript.
De plus, toujours avec javascript, si je clique sur l'image, j'utilise une fonction qui me change les paramètres de x et y pour la première image dans le formulaire et me réactualise l'image (mon premier texte est donc déplacé à l'endroit ou j'ai cliqué). C'est cette fonction que je souhaite modifier.

Je souhaite récupérer la longueur du texte afin de définir la zone ou se trouve mon texte. Mon objectif est que lorsqu'on clique sur la zone ou se trouve le 2ème texte, c'est celui ci qu'on sélectionne et qu'on pourra déplacer. Je pense que je n'aurais pas de difficulté à cela mais ce qui me pause problème c'est de définir ma zone de texte.

Pour la hauteur du texte, j'ai la taille dans le formulaire mais je n'arrive pas à connaitre la longueur en utilisant la taille et le format présent dans le formulaire. J'ai trouvé quelques tutos la dessus mais je les ai mal compris et je ne soit pas sur qu'ils soient vraiment adapté à mon problème.

Merci d'avance de l'aide que vous pourrez m'apporter.

gaerebut · Answer

Bonjour,

utilise offsetWidth pour récupérer la largeur d'un element

A+
Gaerebut

Lilouse64 · Answer

Le problème est que si je n'utilise que offsetWidth() j'aurais la taille de mon texte dans mon formulaire et il n'est pas représentatif de la taille dans mon image vu que celle ci utilise aussi les champs de la taille et du format.

Lilouse64 · Answer

J'ai essayé une solution en utilisant ce que j'ai trouvé sur le net mais cela ne fonctionne pas. En bas de ma page, entre la balise , j'ai écris ceci : Le "width: auto;visibility: hidden;" je l'ai pris sur le forum ou on présentait une solution (pour info le css c'est vraiment pas mon truc) afin de rendre invisible mon texte. formremplir est le nom du formulaire de saisie. taille1, text1 et police sont les nom de mes champs du formulaire pour la taille du texte, la valeur du texte et la police pour le premier texte. Dans ma fonction javascript appeler lors du clic sur l'image, j'ai placé la fonction : alert(document.getElementById("invisible1").offsetWidth); Lorsque je clic sur l'image ça ne m'affiche .... rien. J'ai aussi essayé d'enlever width: auto;visibility: hidden;font-size: pour voir mon texte et la non aussi ... rien ne s'affiche... Des idées pour m'aider ? Merci d'avance.

Lilouse64 · Answer

Désolé pour le triple post m'ais j'ai vraiment besoin d'une solution. Depuis tout à l'heure j'ai fait divers test. j'ai remplacer : document.write("

"+ document.formremplir.text1.value + "

"; par sa valeur valeur en dure hors des balises script. J'ai donc mis :

mzvjhzmùrvhzmv

Maintenant j'ai bien mon message d'alert qui s'affiche mais me donne 901 quelque soit les valeurs de font-size, font-family ou de la chaine de caractère, j'ai toujours le même résultat...

Lilouse64 · Answer

Bonjour

Je fais un petit up, je n'ai toujours pas la solution à mon problème.

Merci d'avance

Lilouse64 · Answer

Après plusieurs essais, ce n'est plus 901 que ça m'affiche mais un autre nombre qui change de temps en temps et reste de nouveau le même pendant plusieurs cliques.

J'ai encore mieux maintenant, quand je clique plus rien de s'affiche ...

Taille d'un texte en pixel

6 réponses

Discussions similaires

Newsletters