Frage: Mouseover + 3 voneinander abhängige Fenster

[Azazel]

Hallo,

ich komme im Moment einfach nicht weiter. Ich finde leider keine Tutorials oder Hilfestellungen, die sich mit meinem Problem befassen.

Um es deutlicher zu machen habe ich 2 Grafiken angehängt.

Bild 1 zeigt den Normalzustand. Es soll 3 Fenster geben. Im linken Fenster soll ein Bild sein.

Bild 2 zeigt, was passieren soll, wenn man mit der Maus über einen Bereich des Bildes fährt.
Zeigt die Maus auf das blaue Viereck, soll im rechten Fenster ein Bild des blauen Vierecks angezeigt werden.
Und passend dazu, im unteren Fenster der Text, der zum blauen Viereck gehört.

Noch ein Beispiel, wie ich es gerne in der Praxis anwenden würde:
Im linken Fenster, ein Bild auf dem 3 Autos dargestellt sind. Fährt man mit der Maus über eines der Autos, soll es farbig markiert werden. Im rechten Fenster soll das ausgewählte Auto dann ausgeschnitten dargestellt werden und im unteren Fenster soll die passende Beschreibung angezeigt werden.

Ich gehe davon aus dass ich folgende Bilder benötige:
Hauptbild (3 Autos)
3 * Texte
3 * Hauptbild (jedes Auto eingefärbt)

Durch einen Bekanntenhabe ich die Möglichkeit einen arbeitsplatz zu benutzen, wo ich Zugriff auf die gängige Software habe.

Flash 8
APS CS
...

Ich habe leider keine Ahnung wie das zurealisieren ist. Sollte ich ein Thema übersehen haben, in dem dies behandelt wird bitte ich dies zu entschuldigen.
Ich würde mich über Tips, anleitungen, Hilfestellungen und auch Links zu passenden Tutorials freuen.


Ich hoffe, dass ich mein Problem klar geschildert habe. Das ganze soll dann in eine Website eingebaut werden.

Danke im Voraus

Markus

 

[Tobias Menzel]

Hi,

eine komplette Anleitung wird Dir das Forum wohl nicht bieten können (wenn Du nur vorübergehend Zugriff auf Flash und noch nicht damit gearbeitet hast, hast Du Dir ganz schön viel vorgenommen).

Was Du benötigst, um Dein Vorhaben zu realisieren:

• Kentniss über Methoden zum Instanzieren (attachMovie) bzw. ausblenden von MovieClips (_visible-Eigenschaft)
  
  
• Korrekte Pfadangaben setzen (this, _parent, _root ...)
  
  
• Arbeit mit dynamischen Textfeldern (.text-Eigenschaft, ggf. htmlText)
  
  
• Mausereignisse entweder auf Instanzen (on (rollOver) {{/mono]) oder auf Zeitleisten-Code (this.onRollOver = function() {{/mono])

Wenn es nicht an diesen Grundlagen liegt, beschreibe bitte, wo genau Du bei der Umsetzung hängst.

Gruß

P.S.: Diese Präsentation innerhalb einer Webseite lässt sich übrigens ebenso gut mit JavaScript umsetzen - wenn Du in diesem Bereich mehr Erfahrung hast, wäre das vielleicht sinnvoller.
.

 

[Azazel]

Hallo Tobias,
danke, dass du geantwortet hast. Das hab ich mir schon fast gedacht. Da habich mir wirklich so einiges vorgenommen. Aber ich muss sagen, dass ich mir schon immer viel selber beigebracht habe. Ich bin davon überzeugt, dass ich auch das hinbekomme.

Ich bin mit der Oberfläche von Flash vertraut. Einfach Animationen (Text der sich dreht usw. bekomme ich hin).

Von den vier Punkten, die du genannt hast, sagen mir die ersten 3 überhaupt nichts.

Den 4. Punkt habe ich mir mit Tutorials jetzt erarbeitet.

Bild1 | Bild2

Ich bin jetzt soweit, dass wenn ich auf Bild 1 zeige, Bild 2 angezeigt wird.

Mein einziges Problem ist jetzt noch, dass ich Bild 1 in verschiedene Bereiche unterteilen möchte. (zum Beispiel der Mund einer Person, die Ohren, die Nase)

Ich weiß einfach nicht, wie man das realisieren könnte. Wären es schöne Bereiche, würde ich das Bild in Photoshop einfach in Vierecke slicen und in Flash dann zusammensetzen. Dann hätte ich durch die einzelnen Bildzeile, einzelne Bereiche denen ich in den Aktionen andere Anzeigebilder für den Mouseovereffekt zuordnen kann.

Hast du einen Idee, wie ich das sonst machen könnte? Könnte ich vielleicht auf einer anderen Ebene über den gewünschten Bereich malen und dann die Deckkraft auf 0 setzen? Geht etwas in die Richtung. Ist aber bestimmt total umständlich und man braucht viele Ebenen/Objekte.

Javascript kann ich leider auch nicht.

Gruß Markus

 

[Tobias Menzel]

Hi,

Du kannst Deine vier Teilbereiche durchaus als Bitmaps in Flash importieren. Dann setzt Du allerdings nicht die Bitmaps direkt auf die Bühne, sondern packst jede in einen eigenen MovieClip und ordnest diese Clips dann nach Wunsch an. Gib den MCs sinnvolle Instanznamen, z.B. "links_oben", "links_unten", "rechts" usw.

Die Methoden/Eigenschaften, die Dir nichts sagen, kannst Du in der Doku nachlesen. - attachMovie & co. brauchst Du bei dieser Variante nicht, da sich alle Objekte von Anfang an auf der Bühne befinden.

Was Du machst, ist dass Du z.B. einen oder mehrere Bereiche zunächst unsichtbar schaltest:

links_unten._alpha = 0;
rechts._alpha = 0; // vgl. _visible

Dann lässt sich einer dieser Bereiche z.B. mit einer kleinen Funktion ein- und ausblenden:

function blendeZu(zielObjekt, zielAlpha) {
    zielObjekt.onEnterFrame = function() {
        this._alpha += (zielAlpha - this._alpha) / 5;
        if (Math.abs(zielAlpha - this._alpha) < 1) {
            this._alpha = zielAlpha;
            delete this.onEnterFrame;
        }
    }
}

Diese Funktion kann z.B. über einen Button aufgerufen werden, wobei Du ihr a) den Instanznamen des zu "fadenden" Objektes und den Ziel-Alphawert übergibst:

// Code auf der Zeitleiste:
mein_button.onPress = function() {
    blendeZu(links_unten, 100); // links_unten wird eingeblendet
}

// oder Code direkt auf einer Button-Instanz:
on (press) {
    _root.blendeZu(_root.links_unten, 100);
}

Bitte verstehe, dass ich bei solchen Fragen ungerne fertige Beispiele poste, da die Erfahrung zeigt, dass Lerneffekte oft durch Copy&Paste substituiert werden. Meist hat man es dann ein paar Tage später mit weiteren (endlosen) Threads zu tun, sobald geringfügige Änderungen an dem Beispiel fällig werden. Wenn Du Dir die Grundlagen anhand von Hinweisen selbst erarbeitest, hast Du auf lange Sicht mehr davon.

Gruß
.