kostenloser Webspace werbefrei: lima-city

Schriftgröße auf Wunsch ändern

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   f********r

   15:30, 17.12.2007

   Hallo Leute!
   
   Ich hätte mal eine Frage: Hab für eine Übung in der Schule die Aufgabe bekommen, dass ich 2 Buttons im Menübereich machen soll, die entweder die schriftgröße bei Klick vergrößern oder eben verkleinern sollen. Hab leider keine Ahnung wie ich an das Problem herangehen soll. Hab auch im Internet bis jetzt nichts gefunden. Ach ja, ich verwende bei dieser Übungsaufgabe iframes, keine div\'s.
   
   Kann mir einer von euch weiterhelfen.
   Thx schon jetzt

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. philippkern

   

   philippkern hat kostenlosen Webspace.

   15:50, 17.12.2007

   In einem iframe ist das nicht so einfach, hmmm.
   Mit PHP wärs einfach ;)
   
   Geht aber sichlich mit Javascript, wie genau kann ich dir aber leider nicht sagen.
4. Autor dieses Themas

   f********r

   16:36, 17.12.2007

   So, nach langem Herumprobieren jetzt so gelöst:
   
   Javascript:
   
   <script type=\'text/javascript\'>
   var groesse=1;
   function schrift(wie){
   if(wie==\'groesser\'){
   groesse*=1.5;
   }
   else{
   groesse/=1.5;
   }
   document.body.style.fontSize=groesse+\"em\";
   }
   </script>
   
   HTML:
   
   <a href=\"javascript: schrift(\'groesser\')\">Schrift groesser</a><br/>
   <a href=\"javascript: schrift(\'kleiner\')\">Schrift kleiner</a>
   
   
   So funktioniert\'s *freu*
   
   Danke an Philipp für die Hilfe
   lG
   fallen

5. chk

   chk hat kostenlosen Webspace.

   16:52, 17.12.2007

   nich schlecht, aber eigentlich unnötig, seit dem sowas in den Browsern integriert ist!

6. mergener

   

   mergener hat kostenlosen Webspace.

   18:00, 17.12.2007

   @chk: das ist total unnötiger spam von dir!
   Ausserdem wenn du lesen könntest würdest du merken das er das für die schule machen muss.
   
   @fallenstar:
   
   1. Verbesserungsvorschlag: teile diese sache in 2 funktionen auf, das ist meiner meinung nach besser
   2. Versuche das nicht per / und * zu lösen sondern per + und -
   Ansonsten bekommt man doch nie den gleichen wert zurück wenn man hochschaltet und dann wieder runter!
   
   Meine lösung:
   
   Ungetestet, man müsste die variablen multip vll anpassen.
   So geht die schrift in gleichmässigen schritten grösser!
   
   
   
   <script type=\'text/javascript\'>
   var groesse=1;
   var multip = 2;
   function bigger()
   {
   groesse += multip;
   document.body.style.fontSize=groesse+\"em\";
   }
   
   function smaller()
   {
   groesse -= multip;
   document.body.style.fontSize=groesse+\"em\";
   }
   </script>
   
   HTML:
   
   <a href=\"javascript: bigger()\">Schrift groesser</a><br/>
   <a href=\"javascript: smaller()\">Schrift kleiner</a>
   
   

7. e********l

   11:39, 18.12.2007

   Und noch etwas dynamischer (ungetestet)
   
   

   function fontSize(sizeAdd, fontType) {
   	var fontSize = document.body.style.fontSize;
   	document.body.style.fontSize = (parseInt(fontSize.substr(0,fontSize.length-2))+sizeAdd)+fontType;
   }

   
   
   HTML:
   
   <a href=\"javascript: fontSize(+10,\'%\')\">Schrift groesser</a><br/>
   <a href=\"javascript: fontSize(-10,\'%\')\">Schrift kleiner</a>
   
   Somit kannst auch gleich zwischen %, EM, PX und dergleichen unterscheiden XD

8. bladehunter

   

   bladehunter hat kostenlosen Webspace.

   20:56, 18.12.2007

   Es geht auch mit moderneren Methoden (IE kann\'s also wahrscheinlich nicht ;) )
   
   http://developer.mozilla.org/en/docs/DOM:stylesheet
   
   

   document.styleSheets[0].insertRule(\"body{font-size:80px;}\",1);

   
   
   Der 2. Parameter gibt die Index-stelle an, wo die Regel im Stylesheet eingefügt werden soll. Theoretisch müsstest du so gezielt Regeln überschreiben können.
   
   Falls nicht bedenke, dass Regeln, die weiter unten stehen, andere Regeln mit dem gleichen Selektor überschreiben.
   
   
   Edit: FF, Opera und Konquerer können das! Und es ist W3C Standard. Wenn dich dein Lehrer deswegen anmacht, hat er Unrecht
   
   Beitrag geändert: 18.12.2007 20:57:15 von bladehunter

9. f******k

   21:25, 18.12.2007

   Wenn ich mich richtig erinnere, war die Aufgabe zwei \"Buttons\" zu erstellen, nicht Links. Das müsste aber genauso funktionieren (nicht getestet!), nur mit
   - Formular erstellen
   <input type=\"button\" value=\"Kleiner(/Größer)\" onclick=\"...
   

10. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?