mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 25.04.2024 12:24 Benutzername: Passwort: Auto-Login

Thema: mootools bzw JS: das 'this' vom 22.10.2012


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> mootools bzw JS: das 'this'
Autor Nachricht
willshedo
Threadersteller

Dabei seit: 21.12.2005
Ort: Waldshut
Alter: 51
Geschlecht: -
Verfasst Mo 22.10.2012 14:01
Titel

mootools bzw JS: das 'this'

Antworten mit Zitat Zum Seitenanfang

Hi alle,

hat gar nicht so viel mit Mootools an sich zu tun, ich hab irgendwie eine grundsätzliche Sache nicht verstanden:
wenn ich mehrere gleiche Elemente auf einer Seite habe
Code:
<div class="aussen">
  <div class="innen"> AA</div>
</div>
<div class="aussen">
  <div class="innen">BB </div>
</div>
<div class="aussen">
  <div class="innen">CC </div>
</div>

und die so anspreche:

Code:
window.addEvent('domready', function(){
var aus = $$('.aussen');
var inn = $$('.innen');
 aus.addEvents({
    mouseenter: function(){
      this.morph({ 'height':'40px'});
      inn.morph({ 'color':'#fcc'});
    },
    mouseleave: function(){
      this.morph({'height':'20px'});
      inn.morph({ 'color':'#000'});
    }
  });
});

spreche ich mit this ja immer das aktuelle div an, das die Größe ändern soll. Gleichzeitig soll innen die Schriftfarbe wechseln. Aber nicht bei allen, nur beim aktuellen...

Hier das ganze als Beispiel, bevor ich lange erkläre:
http://füxli.de/test.html

Wie spreche ich jetzt das innere Div einzeln an, so daß nicht immer alle die Farben wechseln, sondern nur das, das auch grade die Größe ändert?


this.inn.morph({ 'color':'#fcc'}); geht ja nicht, wie formuliert man das, zum Geier?

Bitte helft mir auf die Sprünge...

Grüße,Chris
  View user's profile Private Nachricht senden
fyll

Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht: Männlich
Verfasst Mo 22.10.2012 14:11
Titel

Re: mootools bzw JS: das 'this'

Antworten mit Zitat Zum Seitenanfang

willshedo hat geschrieben:
this.inn.morph({ 'color':'#fcc'}); geht ja nich...

Ne, aber
Code:
this.getElement('.innen').morph();
zB
  View user's profile Private Nachricht senden
Anzeige
Anzeige
ChrisKam

Dabei seit: 01.07.2009
Ort: Hattingen
Alter: 38
Geschlecht: Männlich
Verfasst Mo 22.10.2012 14:15
Titel

Antworten mit Zitat Zum Seitenanfang

Und warum sollte das nicht gehen? Ich kenne mich zwar nicht aus mit Mootools, aber ich bin mir ziemlich sicher, dass man dort auch Elemente traversieren kann.

In jQuery sähe das z.B. so aus:

Code:

$('.innen').on('mouseenter', function() {
   $(this).animate({height: '+=40'}).find('.innen').animate({color: '#000'});
});


Und das war's. Ich verstehe allerdings ohnehin nicht so recht, warum das zwei verschiedene Container sein müssen. In jQuery ist es so, dass Du für Farbanimationen ein zusätzliches Plugin einbinden musst. Vielleicht ist das bei Mootools ja auch so * Keine Ahnung... *

Gibt es einen bestimmten Grund, Mootools zu verwenden?
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
willshedo
Threadersteller

Dabei seit: 21.12.2005
Ort: Waldshut
Alter: 51
Geschlecht: -
Verfasst Mo 22.10.2012 14:36
Titel

Antworten mit Zitat Zum Seitenanfang

Hi,

@fyll: genau das, dankeschön Lächel manchmal ist man echt betriebsblind!

@ChrisKam: Mootools muß hier leider sein, bestehendes Projekt. Mir gehts hier schlicht um die Formulierung, das 'Originalproblem' ist weitaus komplexer als mein kurz zusammengeschustertes Beispielchen...

Danke!
  View user's profile Private Nachricht senden
 
Ähnliche Themen mootools & CO
mootools vs ie6
[Javascript] Mootools
MooTools v1.11 problem
MooTools Script Konflikt
mootools - selector ändern
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.