Dimensionierung div basierend auf der Fensterbreite

Ich habe eine komische Frage. Auf meiner Seite habe ich ein Hauptbild eines Planeten in einem schweren Nebel. Ich habe es so eingestellt, dass die minimale Breite 1000px und die maximale 1500px beträgt. Ich habe die Seiten ausgeblendet und das sieht gut aus mit größeren Bildschirmen. Was ich versuchen möchte, ist, wenn Sie es zum Beispiel auf einem mobilen Gerät betrachten und es die Breite auf 1000 Pixel abschneidet. Ich möchte, dass das Bild 1300 Pixel breit, zentriert und 150 Pixel abgeschnitten ist von jeder Seite aus, so dass Sie das Ausblenden überhaupt nicht sehen können, aber Sie können es trotzdem vergrößern, wenn die Breite des Fensters größer wird, etwa wie bei einem großen iMac. Dieses Ausblenden wird dann wieder sichtbar, wenn Sie die 1300 Pixel breite überschritten haben.

Mein erster Gedanke war, etwas mit negativen Rändern auf beiden Seiten zu tun, aber ich konnte das nicht zum Laufen bringen, während ich die maximalen und Mischbreiten beibehielt.

Dies ist der spezifische Codeabschnitt auf der Seite. Auch wenn HTML und CSS für jeden sichtbar sind, können Sie mit dem Befehl fine die Div-ID ermitteln, die für die weitere Suche benötigt wird.

<code><div style="position:relative;width:100%;">
   <div id="help" style="
      position:relative;
      z-index:1;
      height:100%;
      min-width: 1000px;
      max-width: 1500px;
      margin: 0 auto;
   ">
      <img src="http://i.stack.imgur.com/tFshX.jpg" border="0" style="width:100%;">
   </div>
</div>
</code>

Irgendwelche Gedanken dazu, es ist sehr nahe daran, so zu arbeiten, wie ich es gerne hätte, es bedarf nur einer kleinen Änderung.

Antworten auf die Frage(4)

Ihre Antwort auf die Frage