1
Ich versuche, einen einfachen Hover-Effekt zu tun. Ich benutzte die Vorlage von der Website corelangs.comCSS Hover: funktioniert nur auf einem Bild, aber kein Mehrfaches, wie definieren Funktion
Es funktioniert völlig, aber nur, wenn ich nur 1 Hover-Effekt im Dokument habe.
D.h.:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.urlImg { width: 300px; height:211px; display:block; background-image: url('images/001.jpg'); } .urlImg:hover { background-image: url('images/001over.jpg'); } </style>
</head>
<body>
<a href="http://www.corelangs.com" class="urlImg" title="Corelangs link">
</a>
</body>
</html>
Wenn ich jedoch zwei verschiedene Hover implementieren möchten. (Im Grunde möchte ich eine Thumbnail-Übersicht tun, sagen mit 12 Projekten und wenn auf die Thumbnails klicken sie schweben und sich ein anderes Bild. Es ist immer total ...
In diesem Beispiel habe ich 2 Sekunden schweben
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.urlImg { width: 300px; height:211px; display:block; background-image: url('images/001.jpg'); } .urlImg:hover { background-image: url('images/001over.jpg'); }
.urlImg2 { width: 300px; height:211px; display:block; background-image: url('images/002.jpg'); } .urlImg:hover { background-image: url('images/002over.jpg'); }
</style>
</head>
<body>
<a href="http://www.corelangs.com" class="urlImg" title="Corelangs link"></a>
<br>
<a href="http://www.corelangs.com" class="urlImg2" title="Corelangs link"></a>
</body>
</html>
nicht funktioniert ... irgendwelche Ideen, was sie ändern
Möchten Sie einen Effekt erhalten, wenn eine Maus über einem 'div' schwebt oder versuchen Sie, das Bild * hover * zu machen, das scheinbar über dem Rest der Seite schwebt? –
Es gibt 'urlImg: Hover' 2 mal, aber es gibt keine 'urlImg2: Hover' – JaxCze