Kommentare

BeRo schrieb am 14.11.2012 um 12:34 Uhr

Die Lösung ist relativ einfach.

Da das Hereingleiten normalerweise an der Seitengrenze beginnt, musst Du nur dafür sorgen, dass die Seitengrenze da beginnt, wo Du mit dem Hereingleiten beginnen willst.

Was sich vielleicht etwas kryptisch anhört, wird sofort verständlich, wenn Du die Lösung auf einer Seite in der Seite realisierst.

Am besten geht das mit einem Platzhalter in der Größe des geplanten Einblendbereichs. 

  • Den Platzhalter positionierst Du an der Stelle der Hauptseite, an der das Hereingleiten der Grafik/Info stattfinden soll.
  • Dann legst Du eine neue, absolut leere Seite an, in der Größe des gerade angelegten Platzhalters. Diese Seite nennst Du z. B. "glide"
  • Auf der neuen Seite legst Du (oberhalb der MouseOff Ebene) eine neue Ebene an, die Du z. B. "Info" nennst.
  • Auf der neuen Seite legst Du in der MouseOff Ebene ein Rechteck an, das rundum ca 10px kleiner ist als die neue Seite
  • Dem Rechteck weist Du den MouseOver Effekt "Popup Ebene anzeigen" zu und verweist auf die Ebene "Info"
  • Der Ebene "Info" weist Du die Eigenschaft "von xxxxx hereingleiten" zu.
  • In der Ebene "Info" legst Du den Inhalt ab, der beim Hereingleiten angezeigt werden soll.
  • Im Platzhalter der Hauptseite legst Du einen iframe Code an, der auf die neue Seite "glide" verweist.

Das war's im Wesentlichen, von der Feinarbeit mal abgesehen...

Dazu zählt: Farben der Hintergründe, Navigationsleiste korrigieren, Rahmen positionieren, etc.

So kann die Vorbereitung im Editor aussehen:


Hier nochmal der iframe Code, den Du mit copy & paste übernehmen kannst, wenn Du die Namen der Seite- und Ebene beibehalten willst:

--------------------------------------
<iframe src="glide.htm" style="border:0px #FFFFFF none;" name="test" scrolling="auto" frameborder="0" align=aus marginheight="0px" marginwidth="0px" height="100%" width="100%"></iframe>
--------------------------------------

Und so stellt sich das in der Vorschau dar:


Wie immer, gibt's auch hier wieder die online Demo und die Projektdatei zum Download.

Viel Erfolg und viel Spaß beim weiteren Website Design

Zuletzt geändert von BeRo am 14.11.2012, 12:37, 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... 🤓

Swedo schrieb am 14.11.2012 um 22:54 Uhr

Super, danke für deine klasse Erklärung ! :-)