RollOver-Button - Website X5 Hilfe - Die Helpsite

Direkt zum Seiteninhalt

Hauptmenü:

RollOver-Button

Scripte > Button Navigation

Ein simples RollOver mit Button

Hier einige Beispiele einer Rollover-/Mouseover-Verlinkung mit zwei verschiedenen Button.
Zwei fast identische Button, hier "button_demo-a.gif" und "button_demo-p.gif", müssen auf dem WEB-Server z. B. im  Verzeichnis "images" vorliegen bzw. dorthin kopiert werden. Der Verzeichnispfad und die Dateinamenen müssen dann im Code entsprechend angepasst werden.
Der Pfad kann relativ, also ohne http://www.domain.tld, hinterlegt werden.

Image-Example:

   

RollOver ohne Link:

[Objekt HTML]

<img src="images/button_demo-p.gif"
onmouseover=
"this.src='images/button_demo-a.gif'" onmouseout="this.src='images/button_demo-p.gif'">

RollOver mit Link im gleichen Fenster:

[Objekt HTML]

<a href="ordner/seite.html">
<img src="images/button_demo-p.gif" width="161" height="30" alt="Test Rollover" onmouseover="this.src='images/button_demo-a.gif'" onmouseout="this.src='images/button_demo-p.gif'"/></a>

RollOver mit Link im neuen Fenster:

[Objekt HTML]

<a href="ordner/seite.html" target="_blank">
<img src="images/button_demo-p.gif" width="161" height="30" alt="Test Rollover" onmouseover="this.src='images/button_demo-a.gif'" onmouseout="this.src='images/button_demo-p.gif'"/></a>

RollOver zu Seite im Popup-Fenster:

[Objekt HTML]

<script type="text/javascript">
function popup (url) {fenster = window.open(url, "Popupfenster", "width=500,height=400,resizable=yes");
fenster.focus(); return false;}
</script>
<a href="tools/x5_demo.html" target="_blank" onclick="return popup(this.href);">
<img src="images/button_demo-p.gif"
onmouseover=
"this.src='images/button_demo-a.gif'" onmouseout="this.src='images/button_demo-p.gif'">

RollOver zu Bild im Popup-Fenster:

[Objekt HTML]

<script type="text/javascript">
function popup (url) {fenster = window.open(url, "Popupfenster", "width=500,height=400,resizable=yes");
fenster.focus(); return false;}
</script>
<a href="images/demo.jpg" target="_blank" onclick="return popup(this.href);">
<img src="images/demo_button-p.gif"
onmouseover=
"this.src='images/button_demo-a.gif'" onmouseout="this.src='images/button_demo-p.gif'"></a>

Feedbacks zu ""

es gibt insgesamt 1 Kommentar(e)


  1. Manfred Braak http://www.energiekosten-runter.com schreibt am 28.06.2013, 16.37 Uhr

    Hallo, vielen Dank für die tollen Beispiele, was man alles mit der X5 machen kann. Habe relativ wenig Ahnung von HTML usw. und möchte/muß aber doch eine einigermaßen akzeptable geschäftliche Website erstellen. Das Handbuch ist natürlich nicht besonders hilfreich, wenn es um erweitertes knowhow geht. Umso mehr freut es mich, hier fündig zu werden. Schöne Grüße aus Ostfriesland Manfred J. Braak


Name*
Vorname
Kommentar*
Email *
Homepage
Telefon
Sicherheitscode *
 
Logo HTML5
Button Spenden

© 2009 - 2018




  Besucher Statistik
 » 8 Online
 » 62 Heute
 » 1137 Woche
 » 3349 Monat
 » 47110 Jahr
 » 293688 Gesamt
Rekord: 1420 (10.04.2014)
Zurück zum Seiteninhalt | Zurück zum Hauptmenü