Kommentare

BeRo schrieb am 17.12.2012 um 21:19 Uhr

[...] Wenn ich also auf das Bild klicke, soll das Popup (nur Text) unter dem Bild erscheinen [...]

Das ist mit dem Bordwerkzeug des WD schnell gemacht.

  • Lege eine neue Ebene an und gib ihr z. B. den Namen "Info"
  • Erstelle auf der Ebene die gewünschte Textbox




     
  • Positioniere die Textspalte an der gewünschten Position auf der Seite
  • Verlinke ein Objekt (Bild/Grafik/etc.) mit der neuen Ebene




     
  • Fertig

Die einfache Einblendung funktioniert ganz ohne zusätzliche JavScript Programmierung. Das ändert sich schlagartig, wenn Du z. B. ein Hineingleiten der Textbox realisieren möchtest das erst am linken Rand der hellblau gefärbten Fläche beginnen soll.

Viel Erfolg und viel Spaß beim weiteren Website Design

Zuletzt geändert von BeRo am 17.12.2012, 21:19, 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... 🤓

patrickschult schrieb am 18.12.2012 um 15:40 Uhr

Danke BeRo,

der Textsoll aber so, wie du unten beschrieben hast erst im grau hinterlegten Feld hereingleiten, also am oberen Rand der dunkleren Fläche ( Pfeil).  Das ist dann wohl komplizierter?

Das soll dann so wie bei deinem Beispiel mit iFrame funktionieren aber halt nicht mit Mouse over sondern bei Klick auf das Bild.

Danke Patrick

BeRo schrieb am 18.12.2012 um 18:00 Uhr

[...] der Textsoll aber so, wie du unten beschrieben hast erst im grau hinterlegten Feld hereingleiten, [...] Das ist dann wohl komplizierter? [...]

Da hast Du recht

Allerdings habe ich den WD überreden können, den gewünschten Effekt ohne Programmierarbeit zu Verfügung zu stellen.

Es ist zwar ein bisschen "tricky", aber es funktioniert.

So gehst Du vor:

  • Lege eine neue Seite an, die genau so groß ist, wie der später einzublendende Textrahmen
  • Lege auf der neuen Seite eine neue Ebene an, die Du z. B. "glide" nennst
  • Weise der Ebene die Eigenschaft "von oben hereingleiten" zu
  • Lege die später anzuzeigende Textspalte in der korrekten Größe in dieser Ebene ab
  • Lege ein beliebiges Objekt außerhalb der neuen Seite an, z. B. ein kleines Rechteck
  • Verlinke von diesem Rechteck auf die popup Ebene "Info", die Du gerade angelegt hast
    Der "Link Button" ist nur ein Dummy aber er ist nötig, damit das Hineingleiten des Textes funktioniert.





     
  • Auf der Hauptseite, die das Popup zeigen soll, legst Du eine neue Ebene an, die Du z. B. InfoPH nennst
  •  Auf der neuen Ebene legst Du einen in der Größe passenden Platzhalter an und positionierst ihn da, wo später die Textinfo eingeblendet werden soll
  • Diesem Platzhalter weist Du im Body den folgenden iframe Code zu:
    ---------------------------------
    <iframe src="glide.htm" style="border:0px #FFFFFF none;" name="Info" scrolling="no" frameborder="0" align=aus marginheight="0px" marginwidth="0px" height="100%" width="100%"></iframe>
    --------------------------------
  • Der von Dir dafür vorgesehenen Grafik auf der Hauptseite weist Du nun noch einen Link auf die gerade angelegte popup Ebene "InfoPH" zu.
  • Wenn Du möchtest, kannst Du auf der Hauptseite noch einen Blindrahmen in der Größe der Textbox anlegen, der als Untergrund für den einzublendenen Text herhalten kann.




     
  • Fertig
  • Nach einem Klick auf die auslösende Grafik wird der Text von der Oberkante des Platzhalters aus, in den Platzhalter Rahmen hineingleiten...


     

Viel Erfolg

Zuletzt geändert von BeRo am 18.12.2012, 18:00, 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... 🤓

patrickschult schrieb am 19.12.2012 um 08:55 Uhr


Hallo BeRo,

habe es jetzt mehrfach genau nach deiner Anleitung probiert, funktioniert bei mir leider nicht. Vielleicht kannst du ja mal deine Projektdateien hochladen, da würde ich evtl. meine fehler sehen.

Danke Patrick

BeRo schrieb am 19.12.2012 um 09:47 Uhr

 [...] Vielleicht kannst du ja mal deine Projektdateien hochladen, da würde ich evtl. meine fehler sehen.[...]

Kein Problem.

Hier kannst Du Dir die online Demo ansehen und hier kannst Du Dir die komplette Projektdatei- und die online gestellte Demo herunterladen.

Viel Erfolg

Zuletzt geändert von BeRo am 19.12.2012, 11:26, 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... 🤓

patrickschult schrieb am 19.12.2012 um 11:38 Uhr

Hallo BeRo,

danke für deine super Anleitung. Es klappt jetzt auch (das Java Script auf der glide Seite musste ich noch einsetzen)

Nochmal riesen Lob an deine Top Antworten

Danke Patrick