Ergebnis 1 bis 10 von 10

Thema: Div um 10% vergrößern/verkleinern mit javascript

  1. #1
    Unregistriert
    Gast

    Frage Div um 10% vergrößern/verkleinern mit javascript

    Ich will ein Div um jeweils 10% vergrößern/verkleinern mit javascript

    Code:
    <a href="javascript:set_groeße ('.$10_width.px.', '.$10_height.px.')">+10%</a><br>
                <a href="javascript:set_groeße ('.-$10_width.px.', '.-$10_height.px.')">-10%</a>
    
    
    <script language='javascript' type='text/javascript'>
                <!-- //
                   function set_groeße (width, height) {
                      document.getElementById ('game').style.width = document.getElementById ('game').style.width + width;
                      document.getElementById ('game').style.height = document.getElementById ('game').style.height + height;
                }
    
                // -->
                </script>
    es soll auch möglich sein mehrmal auf +10% klicken zu können.
    Wenn ein Div width 400px hat dann hat $10_width 40px.
    Wenn man dann mehrmal auf +10% klickt soll sich die größe so ändern: 400->440->480->520->560...
    die höhe soll sich ein gleichen 10% schritten mit vergrößern/verkleinern

    weiß nicht warum mein script nicht funktioniert.

    Könnt ihr mir weiterhelfen???
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Meister(in) Avatar von Afrael
    Registriert seit
    26.04.2009
    Ort
    NRW
    Alter
    26
    Beiträge
    313
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Div um 10% vergrößern/verkleinern mit javascript

    Wo soll denn die $10_width-Variable herkommen? Steckt da ein PHP-Script dahinter, das das HTML erzeugt? Wenn ja, poste das mal bitte.
    Ansonsten überprüf nochmal die Syntax, '.-$10_width.px.' sieht irgendwie falsch aus, ich denke, das Apostroph müsste vor das px.

    Übrigens:
    Code:
    document.getElementById ('game').style.width += width;
    macht genau das gleiche wie
    Code:
    document.getElementById ('game').style.width = document.getElementById ('game').style.width + width;
    und ist kürzer.
    Information will frei verfügbar sein.

    Don't eat unpeeled hedgehogs.

  3. #3
    Unregistriert
    Gast

    Standard AW: Div um 10% vergrößern/verkleinern mit javascript

    += hatte ich auch schon ausprobiert, ging aber nicht

    ja, $10_width kommt aus php und ist nicht leer

    '.-$10_width.px.' stimmt, des gibt -40px aus, wenn die original größe 400 ist.

  4. #4
    Meister(in) Avatar von Afrael
    Registriert seit
    26.04.2009
    Ort
    NRW
    Alter
    26
    Beiträge
    313
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Div um 10% vergrößern/verkleinern mit javascript

    Ach, jetzt verstehe ich das ganze erst.
    Deine Funktion will zwei Zahlen von dir haben. "40px" ist jedoch eine Zeichenkette. D.h. es wird die Größe von dem Element genommen und versucht, dazu die Zeichenkette "40px" zu addieren, logisch, dass das nicht geht.

    Kurz ausgedrückt, mach das px in
    <a href="javascript:set_groeße ('.$10_width.px.', '.$10_height.px.')">+10%</a><br>
    weg.
    Information will frei verfügbar sein.

    Don't eat unpeeled hedgehogs.

  5. #5
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Div um 10% vergrößern/verkleinern mit javascript

    ich geb nur so als kleinen tip ne funktion mit dazu...
    parseInt(), sie macht aus 400px ne 400... könnte evtl hilfreich sein
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  6. #6
    Unregistriert
    Gast

    Standard AW: Div um 10% vergrößern/verkleinern mit javascript

    Zitat Zitat von Afrael Beitrag anzeigen
    urz ausgedrückt, mach das px in
    <a href="javascript:set_groeße ('.$10_width.px.', '.$10_height.px.')">+10%</a><br>
    weg.
    .px hab ich jetzt entfernt, hab aber nichts gebracht

  7. #7
    Meister(in) Avatar von Afrael
    Registriert seit
    26.04.2009
    Ort
    NRW
    Alter
    26
    Beiträge
    313
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Div um 10% vergrößern/verkleinern mit javascript

    Code:
    <a href="javascript:set_groesse ('.$10_width.', '.$10_height.')">+10%</a><br>
    <a href="javascript:set_groesse ('.-$10_width.', '.-$10_height.')">-10%</a>
    
    
    <script language='javascript' type='text/javascript'>
                <!-- //
                   function set_groesse (width, height) {
                      document.getElementById ('team1').style.width = (parseInt(document.getElementById ('team1').style.width) + width)+'px';
    
                      document.getElementById ('team1').style.height = (parseInt(document.getElementById ('team1').style.height) + height)+'px';
                }
    
                // -->
                </script>
    Müsste jetzt so funktionieren. Von Verwendung von Sonderzeichen (ß) in Funktions- oder Variablennamen ist übrigens generell abzuraten, gibt evtl. Probleme.

    Edit: Sorry, hab das ganze an einem anderen Beispiel getestet. Statt 'team1' muss es natürlich 'game' heißen. Und synaptic unter mir hat natürlich recht.

    Evtl auch interessant: Dollar-Funktion.
    Code:
    function $() {
        var elements = new Array();
        for (var i = 0; i < arguments.length; i++) {
            var element = arguments[i];
            if (typeof element == 'string')
                element = document.getElementById(element);
            if (arguments.length == 1)
                return element;
            elements.push(element);
        }
        return elements;
    }
    Dann kannst du statt document.getElementById einfach $ schreiben.
    Beispiel: $('game').
    Geändert von Afrael (07.05.2009 um 18:14 Uhr) Grund: Falsche ID im Beispiel
    Information will frei verfügbar sein.

    Don't eat unpeeled hedgehogs.

  8. #8
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: Div um 10% vergrößern/verkleinern mit javascript

    document.getElementById ('team1') würd ich noch in einer variable speichern, wenns so oft benötigt wird!
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  9. #9
    Macrosdesign
    Gast

    Standard AW: Div um 10% vergrößern/verkleinern mit javascript

    nur so am rande erwähnt

    wenn du immer um +10% eerhöst sieht das so aus :

    400 -> 440 -> 484 -> 532.4 -> ... usw.

  10. #10
    Unregistriert
    Gast

    Lächeln AW: Div um 10% vergrößern/verkleinern mit javascript

    dank dir, funktioniert super

    @Macrosdesign sry, wenn ich mich nicht ganz eindeutig ausgedrückt habe, es soll sich immer um 10% des start wertest vergrößern, verkleinern.


    kann geschlossen werden

Ähnliche Themen

  1. div per javascript vergrößern und verkleinern
    Von haillo im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 5
    Letzter Beitrag: 25.01.2009, 21:19
  2. GIF-Animationen vergrößern
    Von hamil im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 12
    Letzter Beitrag: 17.11.2008, 17:39
  3. Vergrößern
    Von Gast im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 9
    Letzter Beitrag: 22.05.2007, 20:43
  4. container mittel css und javascript vergrößern
    Von iskdjim im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 4
    Letzter Beitrag: 11.01.2007, 18:08
  5. Seitenbreite beim Vergrößern und Verkleinern
    Von im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 15.11.2005, 22:49

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •