Automatische Textgröße

JesusFreak777

Erfahrenes Mitglied
hallo,...

hallo ich hab mal wieder ein kleinen Problem bei dem ich nicht weiß ob es da überhaupt abhilfe gibt,...

ich habe ein DIV, könnte aber auch eine Tabelle oder was auch immer sein (da bin ich flexibel, nur Frame mag ich net) in dem ist ne Variable:

PHP:
<div style="border: 1px solid #ffff00; width:280px; height:200px">
<? echo $text; ?>
</div>

in dieser Variable steckt ein unterschiedlich langer Text,...
jetzt wollte ich Fragen ob ich den Text immer so groß machen kann das er imma größtmöglich ist, aber immer in das div passt, fals er nicht passt wird er automatisch kleiner. Die 2. Frage ist ob ich eine Maximalgröße angeben kann zu Deutsch das der text immer z.B. 20pt groß ist, aber wenn er mit 20pt nicht mehr reinpasst springt er auf 18pt wenn das nicht passt 16pt, usw. usw.


Kann miur da jemand helfen?


Gruß Simon
 
was du machen könntest wäre sie länge des textes messes und davon abhängig mit einer switch anweisung die größe festlegen.

ansonsten würde ich dir CSS empfehlen schau fir dazu mal die eigenschaft overflow an
 
Dein Vorhaben ist effektiv nur mit JavaScript möglich. Denn so lange du den Text nicht mit fester Laufweite darstellen lässt, hat jeder Buchstabe eine unterschiedliche Laufweite (das W ist beispielsweise breiter als das J) und die Darstellungsbreite ist nur schwer zu berechnen.
 
hm ja,.. scrolln wollte ich nicht,... aba ich denke, da es net ganz so wichtig war alls ichs einfach wie es ist,...

zum abschluss nochmal
Gehts net? oder isses nur schwer realisierbar?
javascript ist mir klar,...

aber ein Beispiel, ich kann ja einen div machen der automatisch erkennt das der text jetzt länger ist und das er mir jetzt ne scrollleiste anbieten muss,... kann ich diese funktion net zum resizen des Textes ausnutzen?

Gruß Simon
und Danke erstmal
 
Ich sagte bereits, dass es mit JavaScript möglich ist. Dazu musst du ganz einfach die Schrift vergrößern beziehungsweise verkleinern, bis das Element mit der maximal verfügbaren Breite dargestellt wird, ohne dabei in eine neue Zeile umgebrochen zu werden. Dies ist allerdings nur mit Inline-Level-Elementen möglich, da Block-Level-Elemente automatisch immer die maximale Breite einnehmen.
 
hm genau gesagt suche ich ein Funktionierendes Beispiel,...

wie das ganze zu funktionieren hat hab ich schon verstanden,... aber das ganze dann in Javascript umzusetzen kann ich leider nicht,... gibt es evtl. irgendwo ein tuto? oder hat jemand sowas schonmal so ähnlich umgesetzt?
 
Code:
function fitText(elem) {
	var w=0, h=0, s=1, smin=1, smax=10, delta=0.1;
	var sandbox = document.createElement("span");
	sandbox.innerHTML = elem.innerHTML;
	elem.innerHTML = "";
	elem.appendChild(sandbox);

	w = sandbox.offsetWidth;
	h = sandbox.offsetHeight;
	while (elem.offsetWidth>=w && (sandbox.offsetHeight/h)<2 && s<smax) {
		s += delta;
		h = sandbox.offsetHeight;
		elem.style.fontSize = s+"em";
		w = sandbox.offsetWidth;
	}

	w = sandbox.offsetWidth;
	h = sandbox.offsetHeight;
	while (elem.offsetWidth>=w && (sandbox.offsetHeight/h)>0.5 && s>smin) {
		s -= delta;
		h = sandbox.offsetHeight;
		elem.style.fontSize = s+"em";
		w = sandbox.offsetWidth;
	}

	elem.innerHTML = sandbox.innerHTML;
}
 

Neue Beiträge

Zurück