Webauftritt der Institute der TUHH

Style Guide

image classes

Mit img.thumb und img.resize stehen zwei Style-Klassen zum Vergrössern und Verkleinern von Bildern zur Verfügung.

Die Veränderung der Bildgrösse erfolgt durch Anklicken des Bildes mit der linken Maustaste. Die Umsetzung wird durch JavaScript-Funktionen realisiert.

Beispiele

• Beispiel (img.thumb)

  HTML-Quelltext:

  <img alt="hafengeburtstag, bild 50" src="./image_50.jpg" class="thumb" onclick="ImgThumb(this);">
  <img alt="hafengeburtstag, bild 51" src="./image_51.jpg" class="thumb" onclick="ImgThumb(this);">
  <img alt="hafengeburtstag, bild 53" src="./image_53.jpg" class="thumb" onclick="ImgThumb(this);">
  <img alt="hafengeburtstag, bild 74" src="./image_74.jpg" class="thumb" onclick="ImgThumb(this);">
  

  Im Browser:

• Beispiel (img.resize)

  HTML-Quelltext:

  <img alt="Hafengeburtstag, Bild 68" src="./image_68.jpg" class="resize" onclick="ImgResize(this);">
  <img alt="Hafengeburtstag, Bild 72" src="./image_72.jpg" class="resize" onclick="ImgResize(this);">
  <img alt="Hafengeburtstag, Bild 79" src="./image_79.jpg" class="resize" onclick="ImgResize(this);">
  <img alt="Hafengeburtstag, Bild 81" src="./image_81.jpg" class="resize" onclick="ImgResize(this);">
  

  Im Browser: