Ändern einer css-Wert (Links:x), wenn ein browser-viewport ist <1200px

Habe ich einen wrap um meine Inhalte auf einer Webseite, die eine Breite von 1200px. Die wrap-div ist zentriert in der Mitte meiner Seite mit diesem css position:absolute;
top:0px;
left:50%;
margin-left:-600px;
width:1200px;
height:auto;
 ich muss um jQuery verwenden zu ändern, den linken Wert von 50% 0px, wenn der browser-viewport-Breite kleiner als 1200px. Jetzt auf einem ipod zum Beispiel, weil der wrap zentriert ist, meinen content auf der linken Seite abgeschnitten wird keine Möglichkeit zum scrollen auf der Seite.
Vielen Dank im Voraus.

Auch wenn Sie ändern den linken Wert auf 0px, die Inhalte fließen aus der rechten Seite der Seite und Sie müssen nicht einen Weg, um zu Blättern über den Inhalt. Sie gehen zu müssen, entfernen Sie die absolute Positionierung zu bekommen Ihren gewünschten Ergebnis.

InformationsquelleAutor dylfreak6494 | 2011-01-27

  1. 1

    Gibt es einen Grund, warum Sie mit dieser Technik zu Mitte der Elemente? Eine viel einfachere Weg, es zu tun, das funktioniert gut bei kleineren breiten wäre ohne absolute Positionierung und negativen margins!

    div#container {
  width: 1200px;
  margin: 0px auto;
}

    InformationsquelleAutor idlefingers

  2. 4

    Hier ist ein Turnschuh link. Ziehen Sie die resizable-Fenster, um die Größe des Fensters ändern.

    $(window).bind('resize', function(){
    if($(this).width() < 1200)
        $('div.wrap').css('left', 0);
    else 
       $('div.wrap').css('left', '50%');
}).resize();
    Danke! funktionierte perfekt!, nur hatte, um eine css-Funktion, um die margin-left-Wert auf null. <script> $(function(){ $(window).bind('resize', function(){ if($(this).width() < 1200) $('#wrap').css({'left' : '0px', 'margin-left' : '0px'}) else $('#wrap').css('left', '50%'); }).resize(); }); </script>
    herzlich willkommen! sollten Sie akzeptieren die Antwort durch anklicken des grünen Häkchens.

    InformationsquelleAutor Josiah Ruddell

Schreibe einen Kommentar