Sammelthread für Fragen zu den Tutorialen

Posted by: Anonym

Sammelthread für Fragen zu den Tutorialen - 11.07.2009, 23:46:28

Hallo,

in Anlehnung an den Thread für Tutoriale und Codehilfen eröffnen wir hiermit einen Sammelthread für Fragen, die auftauchen können.

Dadurch erhalten die Tutorial-Autoren weniger Post im Chat und können bequem über das Forum antworten. Die Fragenden haben den Vorteil, dass vielleicht auch jemand anderes ihre Frage beantworten kann und sie somit schneller Hilfe bekommen! :-)

Kroko
Posted by: huendchen

Re: Sammelthread für Fragen zu den Tutorialen - 12.07.2009, 15:31:21

Ergaenzend zu Scnappis Zweispaltiges Layout (ohne Tabelle!) moechte ich hier noch eine zweite Methode anfuehren, die alle modernen Browser* verstehen.

Das Markup bleibt das gleich, lediglich das dafuer noetige CSS aendert sich ein bisschen.
Html:
<style>
   #container { display: table; width: 800px;      }
   .column    { display: table-cell;               }
</style>
<!--[if lte IE 8]><style>
   #container { overflow: hidden;                  }
   .column    { float: left; width: 33%;           }
<style><![endif]-->

Hier bedient man sich der erweiterten Darstellungsmodie.
Der Umschliessende Container verhaelt sich wie eine Tabelle und diesem wird auch die Ausgangsbreite zugewiessen. Die Kindelemente ( hier mit colum bezeichnet ) verhalten sich wie Tabellen zellen (td) und teilen sich bruederlich den zur Verfuegung stehenden Platz.
Der IE erkennt jedoch diese Anzeigemodie nicht und deshalb muessen wird hier im Zweiten Block, noch mal extra floats einfuehren mit entsprechenden Breiten fuer die Zellen.

Somit sieht der Quelltext dann folgender massen aus:
Html:
<style>
   #container { display: table; width: 800px;      }
   .column    { display: table-cell;               }
</style>
<!--[if lte IE 8]><style>
   #container { overflow: hidden;                  }
   .column    { float: left; width: 33%;           }
<style><![endif]-->

<div id="container">

   <div class="column">
      <p>Inhalt der Linken spalte.
   </div>

   <div class="column">
      <p>Inhalt der rechten Spalte</p>
   </div>

</div>

Das nur als 'moderne' Ergaenzung ohne den eigentlich Thread weiter zu stoeren. Scnappi war eben eine Stunde schneller als ich :-)

*moderne Browser*: Safari, Chrome, Opera 9.63/10, Mozilla Firefox 3.5 ( Die IE-Familie unterstuetzt diese Anzeigeart bis dato ueberhaupt nicht. )
Posted by: Anonym

Re: Sammelthread für Fragen zu den Tutorialen - 30.03.2010, 20:39:35

Hi,

ich hole diesen Thread mal kurz aus der Versenkung. Da ich im Moment Zeit und Lust habe, Tutoriale zu schreiben, würde ich mich freuen, wenn ihr ein paar Anregungen hättet, wozu ich schreiben kann. Mir selbst fällt nichts ein im Moment, weil für mich vielleicht viele Sachen, die ich auf meiner HP mache, selbstverständlich sind. Wenn ihr aber irgendwelche Wünsche habt, wenn ihr Problene habt, bei denen ihr mal irgendwann stecken geblieben seid, wenn ihr irgendwo mal was gesehen habt, was ihr auch gerne mal machen würdet, dann schlagt es einfach hier vor und ich schau mal, ob ich was dazu schreiben kann. Vielleicht kommen mir ja auch andere zuvor. *g*

Kroko
Posted by: huendchen

Re: Sammelthread für Fragen zu den Tutorialen - 30.03.2010, 22:29:04

Antwort auf: Scnappi
Da ich im Moment Zeit und Lust habe, Tutoriale zu schreiben, würde ich mich freuen, wenn ihr ein paar Anregungen hättet, wozu ich schreiben kann.

Dann fang doch mal an mit Fotogalerien.
Bei vielen sehe ich immer diese Flashanimationen mit Fotos.
Es gibt aber viele, einfachere Methoden, mit denen das zu Realisieren ist ( css, jquery etc. )

Noch mehr Anregungen gefaellig ;)
Posted by: Anonym

Re: Sammelthread für Fragen zu den Tutorialen - 30.03.2010, 22:57:24

Vielleicht welche ohne jquery. *g* JavaScript ist nicht so mein Ding. Damit kann ich nur so ganz simple Sachen.
Posted by: huendchen

Re: Sammelthread für Fragen zu den Tutorialen - 30.03.2010, 23:12:28

Antwort auf: Scnappi
Vielleicht welche ohne jquery. *g* JavaScript ist nicht so mein Ding. Damit kann ich nur so ganz simple Sachen.

Ich schrieb bewusst jQuery.
Wird an der Zeit, dass du dich damit auseinander setzt.
Vllt. kannst du so auch noch was dazu lernen - hast doch eh grad Ferien.
Posted by: Anonym

Re: Sammelthread für Fragen zu den Tutorialen - 04.08.2010, 20:06:48

Ich erhielt gerade im Chat eine Frage zu meinem Tutorial Zweispaltiges Layout, in der es darum ging, dass nicht beide spalten gleich groß sein sollen, wofür das Tutorial ja eigentlich ausgelegt war. Es folgt eine Ergänzung für unterschiedliche Breiten.

Die Markup-Struktur ändert sich geringfügig:
Html:
<div id="container">
   <div id="left">
      <p>Inhalt der Linken spalte.</p>
   </div>
   <div id="right">
      <p>Inhalt der rechten Spalte</p>
   </div>
   <br class="clearer" />
</div>


Der Stylesheet sieht so aus:
Html:
<style type="text/css"><!--
  #left {
      float: left;
      width: 190px; /* Breite der linken Spalte beliebig anpassen */
  }

  #right {
      float: right;
      width: 500px; /* Breite der rechten Spalte beliebig anpassen */
  }

  #container {
      width: 700px;
      /* Spaltenbreiten addieren und eine kleine Pufferzohne frei halten (hier 10px) */
  }

  .clearer {
      clear: both;
      line-height: 0;
  }
--></style>


Für mehr als die kurzen Kommentare im Stylesheet habe ich an Erklärungen gerade nicht viel Zeit, sorry.