Textfarbe ändern bei Mouse over

gehrenberg01 schrieb am 19.08.2015 um 10:21 Uhr

Hallo ,

nach dem ich nun das Grundgerüst für meine Web Site fertig habe, möchte ich die Navigation beginnen.

Habe einen Text in weisser Farbe. Mei Mouse Over sollte er in blau übergehen. Gleichzeitig sollte ein

Klappmenue nach unten aufgehen. Mit den vorgefertigte Buttons vom WD11 bekomme ich zwar die Klappleiste nach unten hin, jedoch die Textfarbe oben ändert sich nicht.

Bräuchte da wiedermal Eure Hilfe. Schon jetzt ein Dankeschön an BeRo die mir die letzten Tage super weitergeholfen hat.  Ich hab mal eine Graphik erzeugt, wie das aussehen sollte.

Grüße Gehrenberg01

Kommentare

BeRo schrieb am 19.08.2015 um 12:17 Uhr

[...] Habe einen Text in weisser Farbe. Mei Mouse Over sollte er in blau übergehen [...]

Dazu sind nur ein paar Mausklicks nötig.

  1. Doppelklick auf den Button
  2. "Gruppe auflösen..." klicken


Dann

  1. Rotes Auge der Button Gruppe in der MouseOver Ebene klicken und Gruppe aufklappen
  2. Rechtsklick in die Textzeile der Button Gruppe
  3. Farbeditor aus dem Kontextmenüfenster wählen
  4. Gewünschte Textfarbe (blau) wählen

Dann

  1. Rechtsklick auf den Button
  2. Aus dem Kontextmenü "Navigationsleiste erstellen" wählen

Fertig

Viel Erfolg

Zuletzt geändert von BeRo am 19.08.2015, 12:17, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 19.08.2015 um 12:55 Uhr

Hallo BeRo,

super schnelle Antwort und von mir Vielen Dank. Ich glaube jedoch, daß ich mich in der Beschreibung vorher falsch ausgedrückt habe. Als erstes habe ich gar keine Buttons mit Hintergrund oder Rechteck, sondern nur ein Text.

Fotomontagen. Dieser Text ist von der Farbe her weiß. Geht man jetzt mit der Maus drauf sollte er sich in Farbe blau ändern. Geht man wieder weg sollte er wieder Farbe weiß haben.

Gleichzeitig sollte noch ein Klappuntermenue nach unten für andere Fotomontagen aufgehen. Ich denke, da kann ich fertige Buttons vom WD11 nehmen.

Was meinst Du dazu ?

Grüße  Gehrenberg01

BeRo schrieb am 19.08.2015 um 14:31 Uhr

[...] Text ist von der Farbe her weiß. Geht man jetzt mit der Maus drauf sollte er sich in Farbe blau ändern [...]

Auch das geht.

Der Aufwand ist nicht geringer und auch ein bisschen "tricky"...

Zunächst solltest Du das automatische Unterstreichen und Einfärben von Textlinks abschalten:

Dann legst Du 2 neue Ebenen + Inhalt an und verpasst dem Linktext die nötigen popup Links

  1. Die Ebene "umenue"
    In diese Ebene kopierst Du das gewünschte Klappmenü
  2. Die Ebene "mo_effekt"
    In diese Ebene fügst Du deckungsgleich eine Kopie des Linktext "Fotomontage" ein und färbst den Text blau.
  3. Nach einem Klick auf den Link Text in der MouseOff Ebene führst Du einen Rechtsklick auf den Link Text im Editor aus wählst Du aus dem Kontextmenü die Option "Web-Animation".
    In der Registertabe "MouseOver" wählst Du im Feld "Popup Ebene anzeigen" die Ebene "mo_effekt", damit bei einem MouseOver der Link Text blau gezeigt wird.


     

Damit funktioniert der MouseOver Effekt für die Anzeige des blauen Link Textes aber noch nicht die Einblendung des Klappmenüs.

Leider kann der WD keine Mehrfachbefehle im Feld "Popup Ebene anzeigen" verarbeiten. Deshalb überlisten wir ihn, indem wir dem blauen Text in der popup Ebene einen weiteren popup Effekt verpassen, der seinerseits das Klappmenü auf der Ebene "umenue" einblendet.

So geht's:

  • Ein Klick auf die Textspalte in der Ebene "mo_effekt"
  • Ein Rechtsklick auf den Link Text "Fotomontage" im Editor
  • Aus dem Kontextmenü "Web Animation" wählen
  • Im Feld "Popup Ebene" die Ebene "umenue" wählen


Fertig

So sollte es jetzt aussehen (vorher - nachher)
 



Viel Erfolg

Edit 16:08 h

Du kannst es Dir einfacher machen, wenn Du das Klappmenü aus der Ebene "umenu" direkt in der Ebene "mo_effekt" anlegst, zusammen mit dem blauen Text.
Dann sparst Du die 2-fache MO Verlinkung und der Effekt ist identisch mit der oben beschriebenen, komplizierteren Version

Zuletzt geändert von BeRo am 19.08.2015, 16:08, insgesamt 2-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 20.08.2015 um 17:17 Uhr

Hallo, BeRo,

ich bins Gehrenberg01, hab alles versucht, jedoch klappts irgenwie nicht wie du mir es beschreibst.

Habe jetzt nochmals eine Vorschau von meiner zukünftigen Site erstellt mit Beschreibung. Wenns es Dir nicht zu Viel Arbeit macht, schaue es nochmals an.

( Text oben weiß, wenn ich mit der Mouse draufgehe sollte er auf blau wechseln. Bei Text Fotomontagen sollte zusätzlich ein Button-Klapp-Menü nach unten aufgehen. ) Habe da ein fertiges vom WD11 übernommen.

Sehr wahrscheinlich habe ich da noch einen krassen Fehler drin.

Danke schon jetzt fürs draufschauen.  Gehrenberg01

BeRo schrieb am 20.08.2015 um 21:28 Uhr

[...] Sehr wahrscheinlich habe ich da noch einen krassen Fehler drin [...]

Da hast Du vermutlich recht.

Leider ist aus Deinem Foto (Screenshot) nichts zu entnehmen, was helfen könnte, die Ursache zu finden.

Allerdings ist erkennbar, dass Du eine NavBar aus Texten nachbilden willst. In dem Fall ist es sinnvoll, die blauen Texte in die MouseOver Ebene zu legen. Das Klappmenü kann nach wie vor in einer separaten Ebene bleiben.

So kann das im Editor aussehen:

Da Du mit den Anleitungen, die ich bisher gepostet habe, offenbar nicht klar kommst, habe ich Dir hier die komplette Projektdatei "fotomontagen.web" zum Download abgelegt.
Lade sie Dir herunter und schau Dir an, wie die Menüs angelegt werden sollten. Mit ein bisschen Einarbeitungszeit sollte es Dir gelingen, das nachzubauen...

Viel Erfolg

-------------------------

Edit 22:42 h
Link geändert

Zuletzt geändert von BeRo am 20.08.2015, 22:41, insgesamt 2-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 20.08.2015 um 22:11 Uhr

Hallo BeRo,

einfach nur super für diese  Hilfe, kann deinen Link  für die Projektdatai zum runterladen nicht öffnen. Kannst Du mir diesen an

gehrenberg01@gmx.de senden.

Viele Grüße

gehrenberg01

BeRo schrieb am 20.08.2015 um 22:41 Uhr

[...] kann deinen Link  für die Projektdatai zum runterladen nicht öffnen [...]

Da stellt sich der Google Shortener quer, weil mit dem Link angeblich die Nutzungsbedingungen verletzt wurden.

Nimm diesen Link, der klappt

Zuletzt geändert von BeRo am 20.08.2015, 22:41, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 21.08.2015 um 19:12 Uhr

Hallo BeRo, hab deine Vorlage heruntergeladen und ausprobiert und getestet und getestet. Habe jetzt nochmals eine Neue Site gemacht. Was geht ist lediglich die Buttonleiste nach unten. Hänge hier schon Stunden dran und find den Fehler einfach nicht. Besteht die Möglichkeit, daß ich Dir hier mal die Site senden.  Speichern im WD11 als Vorlage und dann senden ?

würde mich sehr über eine Info freuen.

Gehrenberg01

BeRo schrieb am 21.08.2015 um 22:23 Uhr

[...] Besteht die Möglichkeit, daß ich Dir hier mal die Site senden. [...]

Kein Problem. Stell' die Projektdatei auf Deinem Webspace online und poste den Link dazu.
Ich bin sicher, dass die Lösung dann nicht lange auf sich warten lässt...

Zuletzt geändert von BeRo am 21.08.2015, 22:23, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 22.08.2015 um 09:09 Uhr

Hallo BeRO,

leider habe ich noch keinen Webspace, und so kann ich Dir die Projektdatai hier über die Community nicht senden.

 

Grüße gehrenberg01

 

BeRo schrieb am 22.08.2015 um 12:48 Uhr

[...] leider habe ich noch keinen Webspace [...]

Warum erstellst Du dann eine Website? Ohne Webspace wird die niemand sehen können!

Alternativ kannst Du natürlich auch einen der zahlreichen Filehoster benutzen, um eine Datei zum Download hoch zu laden. "filehorst.de" ist einer der kostenfreien Anbieter.

Probier's nochmal...

Zuletzt geändert von BeRo am 22.08.2015, 12:48, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 23.08.2015 um 11:28 Uhr

Hallo BeRo,

sobald ich meine Seite fix  fertig habe, kaufe ich mir den Webspace bei Magixs.

ich habe die Projektdatai jetzt über Filehorst hochgeladen.

Hier der Link               http://filehorst.de/d/bgnsudgk

 

hoffe, daß dies so jetzt geklappt hat.

Schöne Grüße     gehrenberg01

BeRo schrieb am 23.08.2015 um 13:06 Uhr

[...] sobald ich meine Seite fix  fertig habe, kaufe ich mir den Webspace bei Magixs. [...]

Um bei Magix Webspace zu bekommen,  musst Du kein Geld in die Hand nehmen. 500MB Webspace bekommst Du gratis (klick)

Für die ersten "Gehversuche" ist das mehr als ausreichend...

So sieht Deine (reparierte) Testsite jetzt im Editor aus:

Deine Testversion konnte nicht funktionieren, weil Du keinen einzigen meiner Tipps umgesetzt hast, warum auch immer.

Lade Dir mal hier die reparierte Version herunter und versuche die Korrekturen anhand meiner Tipps  nachzubauen. Ich drücke Dir die Daumen, dass das klappt.

Viel Erfolg und einen schönen Rest vom Sonntag.

Zuletzt geändert von BeRo am 23.08.2015, 13:06, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 23.08.2015 um 14:01 Uhr

Hallo BeRo,

Vielen Dank für Deine super Unterstützung. Die Inhalte sind jetzt in der Ebenengalerie drin.

Und genau das ist mein Problem wo ich nun schon seit Tagen rumbastle. Ich weiss immer noch nicht wie ich die Inhalte in die Ebenengalerie (Mouse Over ) reinbekomme.

Aber ich gebe nicht auf, bis ich es geschafft habe und weil michs einfach fasziniert.

Dir auch noch einen schönen Sonntag

Gehrenberg01

 

gehrenberg01 schrieb am 25.08.2015 um 21:32 Uhr

Hallo ich bins wieder mal Gehrenberg01,

nachdem ich nun die Klappleiste nach unten mit dem dazugehörigen Text versehen habe, die Unterseiten alle angelegt habe und soweit verlinkt habe, komme ich nicht in der Vorschau bei drücken des Buttons auf die jeweilige Seite.

z.B. ich gehe auf den Butten Inkjet-Systeme und dann öffnet sich die Klappleiste nach unten und ich gehe dann  weiter auf den ersten Button mit Aufschrift ccs 3000l erscheint diese Seite nicht.

kann mir da jemand einen Tipp geben ?

Danke  Gehrenberg01

BeRo schrieb am 25.08.2015 um 21:54 Uhr

[...] ich gehe dann  weiter auf den ersten Button mit Aufschrift ccs 3000l erscheint diese Seite nicht [...]

Deine Beschreibung ist ein bisschen "unscharf" , ein zusätzlicher Screenshot wäre zur Verdeutlichung besser...

So solltest Du die Links auf die jeweiligen Unterseiten anlegen:

Nach einem Doppelklick auf die NavBVar (1.) klickst Du in das zu einem Button gehörende Feld "URL" (2.). Dann klickst Du im Dialogfenster in das Feld "Link auf" (3.), um die Seite auszuwählen, auf die Du verlinken willst.

Natürlich müssen die Zielseiten (Punkt 3. und 4.) vorher angelegt werden, sonst erscheinen sie nicht in der Auswahl.

Zuletzt geändert von BeRo am 25.08.2015, 21:54, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 26.08.2015 um 09:37 Uhr

Hallo BeRo, wie immer zuerst ein Dankeschön. Bin genauso vorgegangen wie du beschrieben hast.
z.B. Startseite: Link auf Seite index (=Startseite)
Link auf Inkjet-Systeme, Link auf CCS300L, Link auf Aqua-Systeme, News usw.
jedoch öffnet sich keine jeweilige Seite wenn ich mit der Mouse drauf gehe.

Die Seiten sind alle im Ebenmenü angelegt.

Beim Button Inkjet-Systeme sollte diese Seite nicht geöffnet werden, sondern man sollte gleich auf die Buttons im Klappmenue kommen. Aber da geht auch nichts.

Das Kuriose ist dabei, ich hab zu Testzwecken ein Neues Projekt angelegt, und aus den Buttonvorlagen vom WD11 dies so nachgebaut. Und da geht es. Gut ich habe hier nur Buttons und keine Text wie in meinem Originalen Projekt. Könntes Du mir freundlicherweise mal auf meine Projektdatai schauen.
http://filehorst.de/d/bDroEnJy

Schöne Güße Gehrenberg01

BeRo schrieb am 26.08.2015 um 12:02 Uhr

[...] jedoch öffnet sich keine jeweilige Seite wenn ich mit der Mouse drauf gehe [...]

Du hast die Links korrekt angelegt und sie funktionieren auch richtig. Dass Du vermeintlich die korrekt geöffnete Seite nicht siehst, liegt daran, dass Du den Text mit der Seiteninfo in der falschen Ebene abgelegt hast. Er wird daher nicht angezeigt und Du glaubst, die aufgerufene Seite wäre nicht da...

[...] Beim Button Inkjet-Systeme sollte diese Seite nicht geöffnet werden, sondern man sollte gleich auf die Buttons im Klappmenue kommen [...]

Da Du eine Seite "Inkjet-Systeme" angelegt hast, macht es durchaus Sinn, diese Seite anzuzeigen, wenn auf den Button "Inkjet-Systeme" geklickt wird. Parallel öffnet sich auch das Klappmenü und es lassen sich die da verlinkten Unterseiten öffnen. Auch da funktionieren die Links.
Wenn Du die Seiteninfo Texte richtig ablegst, siehst Du nach einem Klick auf einen Button des Klappmenüs auch die aufgerufene Seite.

Hier kannst Du Dir die entsprechend korrigierte Projektdatei herunterladen.

Bei der Anlage der Linktexte habe ich noch ein paar Kleinigkeiten angepasst, aber im Prinzip hast Du die Seiten schon verwendbar angelegt...

Zuletzt geändert von BeRo am 26.08.2015, 12:02, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

gehrenberg01 schrieb am 26.08.2015 um 13:45 Uhr

BeRo, einfach nur super von Dir. Hab bei mir gesehen, daß die Texte nicht unter Mouse off drin waren.
Habe jetzt unten noch ein Button Impressum reingemacht. Text Impressum auch auf Mouse off.

 

Bei der Vorschau geht er , aber nur auf der Startseite. Er ist jedoch  auch auf den anderen Seiten überall in Mouse off drin.

Grüße Gehrenberg01

gehrenberg01 schrieb am 26.08.2015 um 14:19 Uhr

Hallo BeRo, mein Problem wo ich vorher geschildert habe, hat sich erledigt.

Alles läuft sauber ab.

 

Grüße Gehrenberg01

gehrenberg01 schrieb am 26.08.2015 um 15:20 Uhr

Hallo BeRo, ich möchte im Klappmenü die Buttonfarbe auf blau änderen. Hast mir schon mal mitgeteilt wie das geht.

CCS 3000L
HMI-Elfin IIC
HMI-Elfin VI
Verbrauchsmittel

Doppelklick auf das Button Menu. Gruppe auflösen, dann die Textfarbe zuweisen. Zum Schluss dann rechte Moustaste und Button Navigationsleiste erstellen drücken.

Klappt soweit alles, kann die Farbe umstellen. Muß ich nach Farbumstellung jedes Buttons am Ende  eine Navigationsleiste erstellen?  Oder sogar auf jeder Seite dies durchführen ?

In der Vorschau zeigt er mir dann nur ein  gänderter Button mit der Farbe blau an.

Danke für eine Antwort

gehrenberg01 schrieb am 26.08.2015 um 15:57 Uhr

Hallo BeRo,

auch dieses Problem habe ich jetzt erledigt. Buttons im Klappmenü ändern sich auf Farbe blau.

Was jetzt noch nicht so schön ausschaut ist, daß der Text in den Buttons nicht in der Mitte ist, bzw. die Buttons sind viel länger wie der Text.

Aber eventuell gibts hier noch eine Lösung.

Grüße Gehrenberg01

BeRo schrieb am 26.08.2015 um 18:17 Uhr

[...] Doppelklick auf das Button Menu. Gruppe auflösen, dann die Textfarbe zuweisen [...]

So kannst Du das machen, aber es geht noch viel einfacher, wenn Du mit dem Auswahlwerkzeug (Pfeil) die NavBar klickst (1. im Screenshot) und dann den Farbeditor öffnest (2. im Screenshot). Danach kannst Du sowohl die Farbe des Textes in der MouseOff Ebene (3. im Screenshot) als auch die Farbe des Textes in der MouseOver Ebene ändern (4. im Screenshot).

[...] Muß ich nach Farbumstellung jedes Buttons [...] sogar auf jeder Seite dies durchführen [...]

Mit der oben gezeigten Methode werden alle Buttons der aktivierten NavBar gleichzeitig geändert und das sogar auf allen Seiten, wenn Du für die NavBar die Option "Auf allen Seiten wiederholen" eingestellt hast (ich hatte das in der Demo so vorgegeben).

[...] Was jetzt noch nicht so schön ausschaut ist, daß der Text in den Buttons nicht in der Mitte ist [...]

Um das zu ändern, gehst Du prinzipiell genauso vor wie vorhin erklärt:

  • NavBar klicken (1. im Screenshot)
  • Textwerkzeug (T) aktivieren
  • Text nach Wunsch formatieren (2. im Screenshot)
    also z. B. zentrieren, Größe ändern, Schriftart ändern, usw.

Auch hier gilt, dass alle Änderungen automatisch von allen Buttons auf allen Seiten übernommen werden.

[...] die Buttons sind viel länger wie der Text [...]

Dann ändere das doch auf die von Dir gewünschte Größe, indem Du die NavBar doppelt klickst und die Option "Gruppe auflösen, um Grafiken zu bearbeiten" wählst.

Die aufgelöste Gruppe kannst Du dann schmaler machen (Mit der Maus am seitlichen Anfasser verschieben (1. im Screenshot)) und anschließend wieder zu einer NavBar zusammenfassen. Das geht am besten, wenn die NavBar noch komplett markiert ist. Dann klickst Du im Kopfzeilenmenü auf "Anordnen" und wählst die Option "Navigationsleiste erstellen" (2. im Screenshot)

Wenn Du alles richtig gemacht hast, kann das Ergebnis so aussehen:

Viel Erfolg

P.S.
Ich klinke mich jetzt aus diesem Thema aus. Andernfalls wäre es einfacher ich würde Dir Deine Website komplett erstellen und dazu fehlt mir einfach die "Lust"

Zuletzt geändert von BeRo am 26.08.2015, 18:56, insgesamt 2-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓