• Apfeltalk ändert einen Teil seiner Allgemeinen Geschäftsbedingungen (AGB), das Löschen von Useraccounts betreffend.
    Näheres könnt Ihr hier nachlesen: AGB-Änderung
  • Viele hassen ihn, manche schwören auf ihn, wir aber möchten unbedingt sehen, welche Bilder Ihr vor Eurem geistigen Auge bzw. vor der Linse Eures iPhone oder iPad sehen könnt, wenn Ihr dieses Wort hört oder lest. Macht mit und beteiligt Euch an unserem Frühjahrsputz ---> Klick

Rollover?

  • Ersteller Max Dittmann
  • Erstellt am

Max Dittmann

Gast
Hallo zusammen!

Kann mir einer von euch den simplen Rolloverbefehl geben? HTML oder un HTML eingebettet??

ist das i-wie im <img xxxx> TAG ?? Gibt es da ne Möglichkeit?

Mfg. Max
 
stk

stk

Grünapfel
Registriert
05.01.04
Beiträge
7.141
Moin,

rollovers baust Du entweder mit JavaScript oder eleganter mit CSS. Für CSS gibt's die Pseudoklasse :hover, welche Du idealerweise auf das Tag <a href> anwendest. Grundsätzlich geht's zwar mit allen Block-Elementen, aber der IE/Win ist da nicht standardkonform.

Also etwa so:
Code: 
ul li a {
  background: url(bildchen-normal.jpg) no-repeat;
  ...
  }

ul li a:hover {
  background: url(bildchen-rollover.jpg) no-repeat;
  ...
  }
...
<ul>
 <li><a href="#">Menu 1</a></li>
 <li><a href="#">Menu 2</a></li>
 ...
</ul>

Gruß Stefan
 
stk

stk

Grünapfel
Registriert
05.01.04
Beiträge
7.141
Moin,

dafür gehört Dir kein Karma, weil die JS-Lösung von anno-dunnemals ist, als das Internet noch über Transmissionsriemen lief. Bitte nicht benutzen!

Gruß Stefan
 
Herr Sin

Herr Sin

Sternapfel
Registriert
05.01.04
Beiträge
4.990
Beispiel nur mit CSS (ohne JavaScript):

Code: 
<html>
<head>
<style type="text/css">

a#home img { background: url(home.gif) top left no-repeat; }
a#links img { background: url(links.gif) top left no-repeat; }
a#about img { background: url(about.gif) top left no-repeat; }

a#home:hover img { background: url(home-over.gif) top left no-repeat; }
a#links:hover img { background: url(links-over.gif) top left no-repeat; }
a#about:hover img {background: url(about-over.gif) top left no-repeat;}

</STYLE>

</head>

<body>

<a id="home" href="home.html"><img src="blank.gif" alt="Home"></a>
<a id="links" href="links.html"><img src="blank.gif" alt="Links"></a>
<a id="about" href="about.html"><img src="blank.gif" alt="About"></a>

</body>
</html>
 

Max Dittmann

Gast
danke, aber

gibts keinen einfachen HTML-Code wie beispielsweise
Code: 
<img src="Bild.gif" onmouseover="Bild2.gif">
oder ähnlich??

Wäre echt praktischer ;)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
2003-2024 Apfeltalk | Made on a Mac
Oben Unten