bilder beim draufklicken verlinken

[bibifellow]

Ich habe auf der Website meine Referenzen

<div id="referenz">
<div class="bild1"></div>
<div class="bild2"></div>
<div class="bild3"></div>
<div class="bild4"></div>
<div class="bild5"></div>
</div>

.bild1 {
      float:left;
      width:200px; 
   height:200px; 
   background:url(bilder/p1.jpg);
      margin-bottom:20px;
   }
.bild1:hover{
  background:url(bilder/p2.jpg);}

Ich habe dazu eine hover Funktion mit einem farbigen Bild nun möchte ich das beim draufklicken auf das Bild in einem neuen Fenster eine Website geöffnet wird. Ist das möglich?

 

[MyBad]

AW: bilder beim draufklicken verlinken

Das klappt am Einfachsten, in dem man die dafür vorgesehenen Tags verwendet: <a href=http://www.dein-link.de">Bild</a>

 

[patrick_l]

AW: bilder beim draufklicken verlinken

- Nicht für jedes Bild eine eigene Div anlegen.
- Mit einer unsortierten Liste ( <ul> ) arbeiten.
- Liste im CSS ansprechen und nach Wusch formatieren.

Da die einzelnen Bilder zur Navigation dienen, würde ich die einzelnen Bilder über CSS einbinden. Dazu im CSS den jeweiligen Anker ( <a> ) über eine entsprechende Klasse ansprechen. Mit background-image (alt. background) gewünschtes Bild einfügen.

<ul>
  <li><a class="img1" href="#">image 1</a></li>
  <li><a class="img2" href="#">image 2</a></li>
  <li><a class="img3" href="#">image 3</a></li>
  <li><a class="img4" href="#">image 4</a></li>
</ul>

In den Galerien selbst die einzelnen Bilder direkt einbinden. Dafür auch wieder eine unsortierte Liste nehmen und die Bilder mit CSS entsprechend formatieren.

<ul id="gallery-people">
  <li><img src="#" alt="" title="" /></li>
  <li><img src="#" alt="" title="" /></li>
  <li><img src="#" alt="" title="" /></li>
  <li><img src="#" alt="" title="" /></li>
</ul>

Liebe Grüße, Patrick

 

[bibifellow]

AW: bilder beim draufklicken verlinken

Hat super geklappt. Leider habe ich jetzt bei Hover eine gelbe Linie unter dem Bild

.bild3:hover{
  background:url(bilder/j2.jpg);
  text-decoration:none;}

habe das uns noch einiges probiert aber der gelbe Strich bleibt hartnäckig.

 

[Soeri]

AW: bilder beim draufklicken verlinken

Schau doch mal mit dem Firebug das Element an. Der sollte Die zeigen, wo der gelbe Strich herkommt.

Grüße
Jürgen

 

[bibifellow]

AW: bilder beim draufklicken verlinken

Kniffelig aber stimmt er hat sich das von a:focus vererbt.

DANKE!