Ergebnis 1 bis 5 von 5

Thema: Layout-verschiebung bei Verkleinerung der Browserbreite

  1. #1
    der/die Göttliche Avatar von jojo87
    Registriert seit
    23.03.2007
    Ort
    Leipzig
    Alter
    30
    Beiträge
    3.131
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Layout-verschiebung bei Verkleinerung der Browserbreite

    Hallo Zusammen.

    Man nehme folgendes Layout:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
      "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http&#58;//www.w3.org/1999/xhtml" xml&#58;lang="en" lang="en">
    
    <head>
    	<title>unbenannt</title>
    	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
    	<style type="text/css" media="all">
    		body &#123;
    			margin&#58; 0;
    			padding&#58; 0;
    			width&#58; 100%;
    			height&#58; 100%;
    			background&#58; #DFE2E3;
    		&#125;
    		
    		#bg &#123;
    			margin-right&#58; 85%;
    			background&#58; #000;
    			height&#58; 500px;
    			width&#58; 15%;
    		&#125;
    		
    		#wrapper &#123;
    			width&#58; 85%;
    			min-width&#58; 900px;
    			margin-left&#58; 15%;
    			top&#58; 0;
    			position&#58; absolute;
    		&#125;
    		
    		#page &#123;
    			width&#58; 900px;
    			background&#58; #fff;
    			height&#58; 500px;
    		&#125;	
    	</style>
    </head>
    
    <body>
    <div id="bg">
    </div>
    
    <div id="wrapper">
    <div id="page">
    
    </div>
    </div>
    
    </body>
    </html>
    Ich möchte gerne erreichen, dass beim verkleinern der Browserbreite der Inhalt der Seite nach links "verschwindet", also der 15% breite linke Teil zuerst abgeschnitten wird.
    ich habe mir schon den Wolf gegoogelt aber nichts erreicht, weiss auch nicht so wirklich, wonach ich suchen soll.

    Gibt es überhaupt eine geeignete Lösung dafür? Da ja normal sich alle Elemente vom linken Rand gesehen ausrichten.

    Schon mal danke für eure Bemühungen,
    Jojo
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    also wenn ich etwas links verschwinden lassen wollte, ahb ich das mit nem gleitenden register gemacht...
    also element absolut positioniert und dann mit javascript nen negativen left-wert zugewiesen (wenn man das alles in kleinen schritten udn mit nem timeout macht, kommt ne feine bewegung zustande
    kannste hier gucken... http://home.arcor.de/aviaticus.ger/pedinfoplay.html
    einfach mal bei geschwister auf nen namen klicken... dann kommt der layer reingefahren... die gleiche bewegung kann man natürlich auch andersherum realisieren...

    nur weiß ich nicht, ob etwas absolut positioniertes auch in dein layout reinpasst... kanns auch grad net testen, steck in der berufsschule^^
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  3. #3
    der/die Göttliche
    Themenstarter
    Avatar von jojo87
    Registriert seit
    23.03.2007
    Ort
    Leipzig
    Alter
    30
    Beiträge
    3.131
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Danke Synaptic, aber das bringt mir leider nicht sehr viel.
    Mit dieser lösung müsste ich ständig den Viewport des Users auslesen und dem enstprechend den left wert verändern. Das wird mir zu umständlich und desweiteren hätt ich ganz gern auf javascript verzichtet.
    Genieß die Schule

  4. #4
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    mir fällt grad noch was ein^^
    würde es gehen, daß du den zu verschiebenden bereich in nen anker packst und den dann per hover oder sowas verschiebst?
    und der viewport is immer document.body.clientWidth
    bei nem eventhandler like onresize kann man da direkt was werkeln^^
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  5. #5
    König(in) Avatar von yeti66
    Registriert seit
    21.10.2005
    Ort
    Harz
    Alter
    51
    Beiträge
    1.152
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    jojo87,

    ich sehe da zwar keinen Sinn und kann auch nicht sagen, ob ich es richtig verstanden habe, aber so könnte es gehen. Mit verschieben im klassischen Sinn hat es allerdings nichts zu tun
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
      "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http&#58;//www.w3.org/1999/xhtml" xml&#58;lang="en" lang="en">
    <head>
    <title>unbenannt</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <style type="text/css" media="all">
    body &#123;margin&#58; 0;padding&#58; 0;width&#58; 100%;height&#58; 100%;background&#58; #DFE2E3;&#125;
    #wrapper &#123;width&#58; 100%;height&#58;500px;background-color&#58;#999999;&#125;
    #left &#123;height&#58; 500px;width&#58; 20%;max-width&#58;200px;padding&#58;5px;display&#58;block;&#125;
    #page &#123;position&#58;absolute;right&#58; 0;top&#58;0;width&#58; 80%;min-width&#58;800px;background&#58; #fff;height&#58;500px;float&#58;right;&#125;
    </style>
    </head>
    <body>
    <div id="wrapper">
      <div id="left">Just the good ol' boys, never meanin' no harm. Beats all you've ever saw, been in trouble with the law since the day they was born. Straight'nin' the curve, flat'nin' the hills. Someday the mountain might get 'em, but the law never will. Makin' their way, the only way they know how, that's just a little bit more than the law will allow. Just good ol' boys, wouldn't change if they could, fightin' the system like a true modern day Robin Hood.</div>
      <div id="page">80 days around the world, we'll find a pot of gold just sitting where the rainbow's ending. Time - we'll fight against the time, and we'll fly on the white wings of the wind. 80 days around the world, no we won't say a word before the ship is really back. Round, round, all around the world. Round, all around the world. Round, all around the world. Round, all around the world.
        
        Barnaby The Bear's my name, never call me Jack or James, I will sing my way to fame, Barnaby the Bear's my name. Birds taught me to sing, when they took me to their king, first I had to fly, in the sky so high so high, so high so high so high, so - if you want to sing this way, think of what you'd like to say, add a tune and you will see, just how easy it can be. Treacle pudding, fish and chips, fizzy drinks and liquorice, flowers, rivers, sand and sea, snowflakes and the stars are free. La la la la la, la la la la la la la, la la la la la la la, la la la la la la la la la la la la la, so - Barnaby The Bear's my name, never call me Jack or James, I will sing my way to fame, Barnaby the Bear's my name.
        
        Just the good ol' boys, never meanin' no harm. Beats all you've ever saw, been in trouble with the law since the day they was born. Straight'nin' the curve, flat'nin' the hills. Someday the mountain might get 'em, but the law never will. Makin' their way, the only way they know how, that's just a little bit more than the law will allow. Just good ol' boys, wouldn't change if they could, fightin' the system like a true modern day Robin Hood.</div>
    </div>
    </body>
    </html>
    Dann würde ich mir an Deiner Stelle mal diese Lösung ansehen; mit horizontalscroll. [ http://www.csszengarden.com/?cssfile=037/037.css ]
    Gruß yeti66
    ___________________________________________
    http://www.phpcontact.net/ Kontaktformulare für die eigene Hompage
    http://www.norbert-klippstein.de Freiberuflicher Musiker für individuelle Musikdienstleistungen

Ähnliche Themen

  1. Layout Verschiebung, Fehler je Browser unterschiedlich! :(
    Von MisterT im Forum HTML & CSS Forum
    Antworten: 9
    Letzter Beitrag: 03.04.2008, 22:04
  2. Problem mit verkleinerung der bilder
    Von fler171087 im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 9
    Letzter Beitrag: 11.09.2007, 20:56
  3. Komplette BrowserBreite!
    Von Jose im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 24.12.2005, 20:02
  4. Bilder mit Text an Browserbreite anpassen
    Von qxxx im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 17.09.2005, 18:39
  5. mehrfach verkleinerung
    Von wernerdeluxe im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 7
    Letzter Beitrag: 22.08.2004, 13:32

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •