Matthias Apsel: Bildwechsel bei onclick in Container

Beitrag lesen

Om nah hoo pez nyeetz, Conny!

ich bin der Neue (Anfänger).

Ich finde es gut, dass du dein Markup bzw. deinen CSS-Code entsprechend auszeichnen wolltest und dich ebenso um eine umfängliche Darstellung deines Problems bemühst.

Kleiner Tipp: markiere zunächst den Text, der als Code ausgezeichnet werden soll und drücke dann den entsprechenden Button. In der Vorschaufunktion hättest du auch sehen können, dass die Formatierung nicht wie gewünscht erfolgt ist. Aber vielleicht hast du dies sogar getan und nur die entsprechende Lösung nicht gefunden.

.gallerycontainer{

position: absolute;
/Add a height attribute and set to largest image's height to prevent overlaying/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid grey;
}

.thumbnail span{ /CSS for enlarged image/
position: absolute;
background-color: #000000;
padding: 0px;
left: -1000px;
border: none;
visibility: hidden;
color: grey;
text-decoration: none;
}

.thumbnail span img{ /CSS for enlarged image/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /CSS for enlarged image/
visibility: visible;
top: 150;
left: 300px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

  
So zum Beispiel.  
  
Ich empfehle außerdem konsequent mit HTML5 zu arbeiten. So kannst du die Angabe  
  
`<style type="text/css">`{:.language-html} zu `<style>`{:.language-html} verkürzen.  
  
  
Matthias

-- 
Der Unterschied zwischen Java und JavaScript ist größer als der zwischen [Lot und Lotion](http://selfhtml.apsel-mv.de/java-javascript/index.php?buchstabe=L#lot).  
![](http://www.billiger-im-urlaub.de/kreis_sw.gif)