Linuchs: Panoramabild zusammensetzen, x-scrollbar

Beitrag lesen

Hallo,

ich möchte ein Panorama-Bild aus drei nebeneinanderliegenden Bildern zusammensetzen. Dabei soll jedes Einzelbild so breit und hoch sein wie das Fenster.

Den umgebenen Container habe ich absolut positioniert, um 100% nach links versetzt und 300% breit gemacht. Die Bilder haben darin 33% Breite, also pro Bild etwa Fensterbreite.

Nun erwarte ich, dass das mttlere Bild flächendeckend gezeigt wird und man links - rechts scrollen kann. Das Scrollen geht aber nur nach rechts, d.h. das linke Teilbild ist nicht erreichbar.

Eingebundene CSS-Datei des Projekts:

  div#fix_body {
    display: none;
    position: fixed;
    left:     0;
    right:    0;
    top:      0;
    bottom:   0;
    z-index:  -1;
  }
  div#fix_body img {
    width: 100%;
    height: 100%;
  }

Krrekturen für das Panorama:

  /* Platz fuer 3 Bilder */
  div#fix_body {
    position: absolute;
    left: -100%;
    right: -100%;
    width: 300%;
    white-space: nowrap;
  }
  div#fix_body img {
    width: 33%;
    border-left: 1px solid #f00;
    border-right: 1px solid #f00;
  }

Warum geht das nicht?

Wenn's fertig ist, möchte ich das Panorama als Hintergrund haben, in y-Richtung fixiert. geht das?

P.S. das Einblenden des Bildes per Javascript macht Sinn, weil je nach Bild-Inhalt (z.B. nachts) der Text kaum zu lesen ist. Ohne Javascript gibt's kein Bild.

Linuchs