document.all.Text.style.fontSize ? Dynamisch !

ThePosterity

Aktives Mitglied
<html>
<head>
<title>Test</title>

<script type="text/javascript">

function MachGroesser () {
document.all.TEXT.style.fontSize = "200%";
}

function MachKleiner () {
document.all.TEXT.style.fontSize = "50%";
}

</script>
</head><body>

<p id="TEXT">Das ist der Text</p>
<a href="javascript:MachGroesser()">MachGroesser</a>
<a href="javascript:MachKleiner()">MachKleiner</a>
</body></html>

So das wird wohl bald ein ende haben mit der fragerei
wink.gif

ich möchte gerne den TEXT auf jeweiligen Button vergrössern oder
verkleinern und zwar schrittwweise .wie mache ich es ?(geht es auch ohne javascript ?)
wie auch immer euer rat ist gefragt
rolleyes.gif


Danke schon mal ThePosterity
 
vielleicht so... habe es jetzt aber nicht getestet
tongue.gif


CODE
<script type="text/javascript">
var groesse=200; // anfangswert
var groesse_min=50; // minimaler wert
var groesse_max=200; // maximaler wert
var schrittweite=50; // wert um den die groesse vergroessert bzw. verkleinert wird


function MachGroesser () {
// nur erhoehen, wenn der maximal-wert nicht ueberschritten wuerde
if(groesse+schrittweite <= groesse_max) groesse += schrittweite;

document.all.TEXT.style.fontSize = ""+groesse+"%";
}

function MachKleiner () {
// nur verringern, wenn der minimal-wert nicht unterschritten wuerde
if(groesse-schrittweite >= groesse_min) groesse -= schrittweite;

document.all.TEXT.style.fontSize = ""+groesse+"%";
}

</script>



statt all.TEXT willst du aber wahrscheinlich eher getElementById("TEXT") benutzen und dem entsprechenden slot (d.h. div,span,p,was auch immer -tag) das attribut id="TEXT" geben


dass sowas ohne JavaScript/ECMAScript geht, mag ich zu bezweifeln
 
<html><head><title>Mach Gross_bzw_klein !!!</title>
<script type="text/javascript">
var groesse=200; // anfangswert
var groesse_min=50; // minimaler wert
var groesse_max=200; // maximaler wert
var schrittweite=50; // wert um den die groesse vergroessert bzw. verkleinert wird


function MachGroesser () {
// nur erhoehen, wenn der maximal-wert nicht ueberschritten wuerde
if(groesse+schrittweite <= groesse_max) groesse += schrittweite;

document.getElementById("TEXT").style.fontSize = ""+groesse+"%";
}

function MachKleiner () {
// nur verringern, wenn der minimal-wert nicht unterschritten wuerde
if(groesse-schrittweite >= groesse_min) groesse -= schrittweite;

document.getElementById("TEXT").style.fontSize = ""+groesse+"%";
}

</script>
</head><body>
<p id="TEXT">Das ist der Text</p>
<a href="javascript:MachGroesser()">MachGroesser</a>
<a href="javascript:MachKleiner()">MachKleiner</a>
</body></html> Copyright by ThePosterity 2006 (http://theposterity.th.ohost.de/)
Ja so ist es gut !Danke dir bn`
biggrin.gif

Geht das eigentlich mit allem z.b. Bilder auch ?
Geht das mit der kompletten seite (scalieren) ?
 
Natürlich kannst du auch die Schriftgröße der ganzen Seite ändern, aber die ganze Seite skalieren geht da meines Wissens nicht.

Um die angezeigte Größe eines Bildes zu verändern, kannst du die CSS-Attribute "width" und "height" benutzen.
Statt .style.fontSize eben .style.width und .style.height.
 
So, dieser Thread hat mich gestern abend auf die Idee gebracht, so etwas endlich einmal bei mir einzubauen.

Jetzt ist fast meine ganze Domain (mit Ausnahme der Unicode-Datenbank) per + vergrößerbar, per - verkleinerbar - und einen Reset-Knopf gibt es auch noch.

Der Vorteil der Xml-Variante zeigt sich da: Ich mußte den Code eben nur entwickeln und an einer Stelle passend einbinden. Um die Xml-Version zu aktualisieren, hat es genügt, nur die CSS-, die .js und die eine Xsl-Datei hochzuladen. Das Hochladen der ganzen Html-Dateien hat dagegen lange gedauert.
 
nett.. und so viel ordentlicher als mein 3-minuten-script von gestern abend
smile.gif
 
jAuer da brauchst du nicht mehr so nah am Monitor sitzen
wink.gif

Irgendwo hier hatte ich gelesen das wohl manchmal die Schrift zu klein wäre ?
Da ist mir die Idee gekomen das ja wohl nicht nur du damit Probleme haben wirst ?
Also diese idee !
biggrin.gif
(Das kostet dich aber was
wink.gif
)
Aber nur wenn es Positive bemerkungen über diese Funktion gibt
wink.gif



Gruß ThePosterity
 
<script type="text/javascript">
function Drehamrad(Name , Startwert , Endwert , Schrittweite){
var minus = false;
var plus = Schrittweite;
var nWert = parseInt(document.Form3.elements[Name].value);

if(event.wheelDelta <= Startwert && (minus || nWert > Startwert)) {
nWert=nWert-plus;
}

else if(event.wheelDelta >= 1 && nWert < Endwert ) {
nWert+=plus;
}

document.Form3.elements[Name].value=nWert;
return false;
}
</script>
<form name="Form3">
<input type="text" name="eins" value="1"
OnMouseWheel="return Auswahlrad('eins' , 1 , 10 , 1);">
</form>
Ich dieses mit dem von oben zusammen verknüpfen doch leider funktioniert es
wohl nur im IE aber nicht im Firefox2 ???

Wenn ihr da noch eine Idee habt die mich zur Lösung bringt bin ich
schon viel glücklicher .

THX
 
Hi,
Soweit ich weis unterstützt Firefox onmousewheel nicht und daher wird auch keine Funktion aufgerufen.

mfg Severin Fink
 
Zurück
Oben