• michaelsinterface.de
• >
• Sitemap

Sitemap

•  HomeStartverzeichnis der Internetpräsenz michaelsinterface.de
  •  ProjectWebprojekt-Einführung / -Vorstellung
  •  ProfileKurzvorstellung, Vita, Fokus, Hobbies
  •  ImprintImpressum, Verantwortlicher Herausgeber
•  NewsWas gibt's Neues auf michaelsinterface.de?
•  LabExperimente mit CSS und Javascript.
  •  CSS-SkillsCSS-Experimente / - Anwendungsbeispiele
    •  css.dropdownTabmenuEin CSS-Dropdown-Menü, das in seinen Tabs jeweils eine Liste an Untermenüs beherbergt.
    •  horizontal.scrollBoxEine CSS-Box, deren Inhalt horizontal scrollfähig ist.
    •  css.menuTooltipIn diesem Experiment wird beim Überfahren der einzelnen Menüpunkte ein "Hinweisfenster" eingeblendet, in dem zusätzliche Informationen notiert werden können.
    •  css.hoverSelectorsDieses Experiment demonstriert beim Überfahren der Eltern- bzw. Nachbarbox das Hover-Verhalten für ihr Nachfahren-, Kind- und Nachbarelement, sowie das Öffnen dieser Elemente als CSS-Popups.
    •  2column.listEine einfache (nicht-verschachtelte) Aufzählungsliste, deren Listeneinträge zweispaltig angeordnet sind.
    •  list.showcasesEine horizontal ausgerichtete Liste, deren Listenpunkte hier als "Schaukasten" für besonders hervorzuhebende Informationen dienen.
    •  css.tabmenuEin horizontales CSS-Tabmenü in diversen Farb-Variationen.
    •  css.fieldsetDieses CSS-Modell "simuliert" das <fieldset>- und <legend>-Tag, die zum Gruppieren von Formularelementen dienen.
    •  png.opacityEine Box mit semitransparentem PNG-Hintergrundbild - incl. Workaround für den IE6, der das PNG-Format nicht unterstützt.
    •  3cols.equalHeightEin dreispaltiges CSS-Layout, dessen Spaltenhöhen sich unabhängig von ihrem Inhalt im Viewport automatisch angleichen.
      •  3cols.equalHeight | basicDreispaltiges Basismodell.
      •  3cols.equalHeight | headerDreispaltig mit Headerbereich.
      •  3cols.equalHeight | header + footerDreispaltig mit Header-, und Footerbereich.
      •  3cols.equalHeight | header + topNavi + footerDreispaltig mit Header-, TopNavi- und Footerbereich.
    •  css.layoutHier stelle ich diverse Positions- und Float-Techniken für tabellenlose CSS-Layouts vor.
      •  css.layout | position.01
      •  css.layout | position.02
      •  css.layout | position.03
      •  css.layout | position.04
      •  css.layout | position.05
      •  css.layout | position.06
      •  css.layout | position.07
      •  css.layout | position.08
      •  css.layout | position.09
      •  css.layout | float.01
      •  css.layout | float.02
      •  css.layout | float.03
      •  css.layout | float.04
      •  css.layout | float.05
      •  css.layout | float.06
      •  css.layout | float.07
      •  css.layout | float.08
      •  css.layout | float.09
    •  css.displayDieses Modell empfindet ein kleines Interface-Display mit Control-Buttons nach, und war mein Beitrag zum "css2k2-Challenge".
    •  css.barcodeEin "handelsüblicher" Barcode, der auf purem CSS basiert, und keinerlei Grafiken enthält.
  •  JS-SkillsJS-Experimente / - Anwendungsbeispiele
    •  link.innerHTMLDer Inhalt einer Box wird ein- bzw. ausgeblendet, und entsprechend des Status der Linktext getauscht.
    •  swap.imageCommentDie Bildergalerie wurde um eine Funktion erweitert, die das Anlegen von Kommentaren zu den einzelnen Bildern ermöglicht, die analog zum Bildertausch eingeblendet werden.
    •  swap.imageEine kleine simple Bildergalerie, bei der beim Klick auf die Thumbnails in einer "ImageBox" die größeren Bilder getauscht werden.
•  TutorialsKommentierte Anleitungen zu diversen CSS- und JS-Anwendungen.
  •  CSS-TutorialsCSS-Anleitungen
    •  image.bgColorDie CSS-Eigenschaft 'background-color' steuert (füllt) in diesem Demo die transparente Palettenfarbe einer GIF- oder PNG-Grafik, und wird beim Überfahren der Grafik getauscht.
    •  exchange.classNameDieses Anwendungsbeispiel ist vor Jahren aus dem Umstand erkoren, da der IE6 (und älter) die allg. :hover-Pseudoklasse nicht unterstützt, um für Elemente beim Überfahren mit der Maus ein dynamisches Verhalten zu definieren.
    •  scroll.tableWie wäre es mit einer Tabellenzelle, deren Inhalt gescrollt werden kann?
      •  scroll.table.v2
      •  scroll.table.v3
      •  mp3.playlist
    •  menu.buttonsEine kurze Einführung, wie sich Links zu Menübuttons gestalten lassen.
    •  image.opacityDie CSS3-Eigenschaft 'opacity' steuert die Transparenz von Elementen, und wird in diesem Tutorial auf Grafiken angewendet, die beim Überfahren mit der Maus ihre Transparenz verändern.
    •  css.documentationIn dieser CSS-Referenz habe ich die gängigen CSS2-Eigenschaften zusammengefasst, und stelle sie anhand von Quellcode-Beispielen und Online-Demos näher vor.
  •  JS-TutorialsJS-Anleitungen
    •  exchange.displayDieses Tutorial beschäftigt sich mit dem Ein- und Ausblenden von HTML-Elemnten mittels der CSS-Eigenschaft 'display' und ihren beiden Eigenschaftswerten 'block' und 'none'.
    •  blur.linksEs gibt Situationen, in denen der gepunktete Rahmen beim Anklicken eines Links oder Formular-Buttons nicht erwünscht ist. Das Tutorial stellt hierfür eine Lösung vor, die auf JS basiert.
    •  move.layer
      •  horizontalDIV-Box horizontal bewegen.
      •  verticalDIV-Box vertikal bewegen.
    •  show.hideDIV-Box anzeigen und verstecken.
•  OutsourcesLinkarchiv, Referenzen, Handbücher, uvm.
  •  HTMLHTML-Referenzen
    •  edition-w3c.de/tr/html4
    •  selfhtml.org/html
  •  CSSCSS-Referenzen
    •  css3.info
    •  css.maxdesign.com.au
    •  css-news.com
    •  cssplay.co.uk
    •  developer.mozilla.org/css
    •  edition-w3c.de/tr/rec-css2
    •  selfhtml.org/css
    •  thestyleworks.de
  •  JS/AJAXJS/AJAX-Referenzen
    •  cross-browser.com
    •  developer.mozilla.org/ajax
    •  developer.mozilla.org/javascript
    •  downloadjavascripts.com
    •  quirksmode.org
    •  selfhtml.org/javascript
    •  webFX.eae.net
  •  eZinesOnline-Magazine
    •  456bereastreet.com
    •  alistapart.com
    •  designerinaction.de
    •  smashingmagazine.com
•  SitemapInhaltsverzeichnis der Internetpräsenz michaelsinterface.de
•  ContactKontakt-Formular