Größenveränderung von Text in einem <div> (als Zoomeffekt)
Martin Hölter
- dhtml
0 Utz0 Martin Hölter0 Utz0 Martin Hölter0 Martin Hölter0 Utz
Hallo Forum!
Ich habe folgendes Problem:
Ich würde gerne ein <div> einzoomen, indem ich dessen Größe verändere. Da hierdrin allerdings Text steht, bewirkt die Größenänderung nichts erkennbares. Deshalb würde ich auch gerne die Schriftgröße verändern, kenne allerdings den Befehl dazu nicht.
Hier das bisherige Script:
function bewegen(){
hoehe = Math.round(i/8.29);
groesse = Math.round(hoehe/4);
if (document.all) /* wenn Microsoft-Modell */
{
document.all.Layerelemente3c73a96296e7084.style.width=i; /*Breite verändern */
document.all.Layerelemente3c73a96296e7084.style.height=hoehe; /*Höhe verändern */
// document.all.Layerelemente3c73a96296e7084.style.fontSize=groesse; /*Höhe verändern */
}
else
if (typeof(document.getElementById)=="function")
/* wenn Netscape 6.x */
{
document.getElementById("Layerelemente3c73a96296e7084").style.width=i; /*Breite verändern */
document.getElementById("Layerelemente3c73a96296e7084").style.height=hoehe; /*Höhe verändern */
// document.getElementById("Layerelemente3c73a96296e7084").style.fontSize=groesse; /*Höhe verändern */
}
else
if (document.Layerelemente3c73a96296e7084) /* wenn Netscape 4.x */
{
document.Layerelemente3c73a96296e7084.width=i; /* Breite verändern */
document.Layerelemente3c73a96296e7084.height=hoehe; /* Höhe verändern */
// document.Layerelemente3c73a96296e7084.fontSize=groesse; /* Höhe verändern */
}
if (i < 232){
i = i + speed;
window.setTimeout("bewegen()", pause);
}
}
}
Wäre schön, wenn mir jemand helfen könnte.
Gruß,
Martin Hölter
P.S. Die fontSize-Befehle sind wahrscheinlich Quatsch, deshalb hab ich Sie als Kommentare gekennzeichnet...
Hallo,
P.S. Die fontSize-Befehle sind wahrscheinlich Quatsch, deshalb hab ich Sie als Kommentare gekennzeichnet...
Nö, die sind eigentlich schon ok, vgl. http://selfhtml.teamone.de/javascript/objekte/style.htm.
Problem 1: Du übergibst der Eigenschaft fontSize eine Zahl ohne Einheit (px, pt, em usw.)
evtl. Problem 2: Denkbar ist, dass eine Änderung der fontSize-Eigenschaft des Divs sich nicht auf die dargestellte Schriftgröße auswirkt - dann nämlich, wenn innerhalb des Divs die Schriftgröße nochmal definiert wird, das würde dann die fontSize-Eigenschaft des Divs überschreiben. Kann man anhand des Code-Schnippsels, den Du gepostet hast, nicht erkennen, ob das evtl. auch der Fall ist.
Grüße,
Utz
Hallo!
Nö, die sind eigentlich schon ok, vgl. http://selfhtml.teamone.de/javascript/objekte/style.htm.
Problem 1: Du übergibst der Eigenschaft fontSize eine Zahl ohne Einheit (px, pt, em usw.)
Als ich keine Einheit drin hatte, kam keine Fehlermeldung, es passierte einfach nur nichts sichtbares. Mit Einheit
groesse = Math.round(hoehe/4)+"px";
passiert das gleiche.
evtl. Problem 2: Denkbar ist, dass eine Änderung der fontSize-Eigenschaft des Divs sich nicht auf die dargestellte Schriftgröße auswirkt - dann nämlich, wenn innerhalb des Divs die Schriftgröße nochmal definiert wird, das würde dann die fontSize-Eigenschaft des Divs überschreiben. Kann man anhand des Code-Schnippsels, den Du gepostet hast, nicht erkennen, ob das evtl. auch der Fall ist.
Zitat aus o.g. Link: Es ist egal, ob das betroffene HTML-Element vorher bereits Style-Sheet-Angaben enthält oder nicht.
Also sollte es eigentlich nicht stören, oder verstehe ich da was falsch?
Hier noch ein bisschen relevanter Quelltext:
<style type="text/css>
#Layerelemente3c73a96296e7084 {position: absolute; visibility: visible; left: 43px; top: 279px; width: 232px; height: 28px; z-index: 1;}
font.elemente3c73a96296e7084 {font-size:19px}
</style>
<div id="Layerelemente3c73a96296e7084">
<table border="0" cellspacing="0" cellpadding="0" width="232">
<tr><td><font class="elemente3c73a96296e7084" FACE="Arial, Helvetica" SIZE=+1 color="#000000">Gestalten Sie Ihre Zukunft</font></td></tr>
</table>
</div>
Trotzdem schonmal Danke!
Gruß,
Martin Hölter
Hallo Martin,
Zitat aus o.g. Link: Es ist egal, ob das betroffene HTML-Element vorher bereits Style-Sheet-Angaben enthält oder nicht.
Also sollte es eigentlich nicht stören, oder verstehe ich da was falsch?
Wenn es um exakt das selbe Element geht: stört nicht. Wenn es um Kindelemente geht: das stört natürlich erheblich!
Ich formatier Deinen Quelltext mal eben übersichtlicher, da wird das Problem deutlicher:
<style type="text/css>
font.elemente3c73a96296e7084 {font-size:19px}
</style>
<div id="Layerelemente3c73a96296e7084">
<table border="0" cellspacing="0" cellpadding="0" width="232">
<tr>
<td>
<font class="elemente3c73a96296e7084" FACE="Arial, Helvetica" SIZE=+1 color="#000000">Gestalten Sie Ihre Zukunft</font>
</td>
</tr>
</table>
</div>
Dem Font-Element (das übrigens ein denkbar verwirrender Container für CSS-Angaben ist) weist Du über die Klasse .elemente... 19px Schriftgröße zu.
Dem umgebenden Div weist Du dynamisch per Script eine andere Schriftgröße zu. Das Div vererbt auf table, table vererbt auf tr, tr vererbt auf td, td vererbt auf font - allerdings in allen Fällen immer mit Ausnahme der Angaben, die dem Kindelement speziell mit auf den Weg gegeben wurden, daher bleiben die 19px Schriftgröße des Font-Elementes stehen.
Du hast zwei Optionen:
1. Du änderst den Aufbau so, dass keine störenden CSS-Angaben mehr auf etwaigen Kind-Elementen hängen.
2. Du sprichst direkt das Font-Element an, etwa so:
document.getElementById("elemente3c73a96296e7084").style.fontSize=groesse;
statt
document.getElementById("Layerelemente3c73a96296e7084").style.fontSize=groesse;
Grüße,
Utz
Hallo Utz!
Du hast zwei Optionen:
- Du änderst den Aufbau so, dass keine störenden CSS-Angaben mehr auf etwaigen Kind-Elementen hängen.
Da ich leider ein Programm verwenden muss, dass die Angaben von selbst setzt, kann ich daran nichts ändern. Ich kann diesen Teil auch nicht per Texteditor ändern, da bei der nächsten Änderung mit dem Programm diese sofort verworfen werden (in diesem tollen Programm kann man auch nicht selbst den html-Code editieren). Ich kann auch kein anderes Programm benutzen, da auch andere daran rumbasteln und diese sich nur mit diesem Programm auskennen. Es sind übrigens AOL-Nutzer...
- Du sprichst direkt das Font-Element an, etwa so:
document.getElementById("elemente3c73a96296e7084").style.fontSize=groesse;
statt
document.getElementById("Layerelemente3c73a96296e7084").style.fontSize=groesse;
Da kommt dann die Fehlermeldung: 'Objekt erfoerderlich'
Gruß,
Martin Hölter
Hallo!
Ich habs jetzt doch geschafft!
Ich hab noch ein <p id=".."> dazwischen gesetzt, jetzt kann ich auf diese ID zurückgreifen. Trotzdem vielen Dank für die Hilfe!!!
Gruß,
Martin Hölter
Hallo Martin,
Ich habs jetzt doch geschafft!
Ich hab noch ein <p id=".."> dazwischen gesetzt, jetzt kann ich auf diese ID zurückgreifen. Trotzdem vielen Dank für die Hilfe!!!
Prima - ich hatte mich vorhin verlesen und gedacht, das Font-Element hätte ne ID, sorry für die Verwirrung.
Grüße,
Utz