Design

Pattern Tap - Web Design Collection

Pattern Tap wurde ins Leben gerufen um das schönste Interface Design des Webs zu zeigen. Es sollte eine Möglichkeit geschaffen werden, die es einem erleichtert, einige ausgewählte und besondere Referenz-Beispiele schnell aufindbar zu machen.

Manchmal ist es nicht so einfach auf Anhieb ein Anwedungsbeispiel für eine schöne horizontale Navigation zu finden oder man sucht vielleicht nach einer Idee für eine Subnavigation.

Pattern Tap kategorisierte Referenz-Beispiele, stellte sie online und bietet somit eine Quelle der Insperation zur Ideefindung von Interface Design.

Pattern Tap

Mouse-Over Zoomansicht mit jQuery

JQZoom Evolution bringt ein neues Release mit erweiterten Features heraus. Die Zoom-Funktion für Bilder funktioniert mit dem bekanntem jQuery Javascript Framework. jQzoom vergrößert die Stelle eine Bildes über die der Mauszeiger gelegt wird. Die Anwendung ist einfach zu skripten, leicht anpaßbar und läuft auf allen neuen Browsern. Die Software ist lizensiert unter GPL.

JQZoom Evolution

Slide Login Panel mit Mootools

Das neue Tutorial von Web-Kreation zeigt ein Anwendungsbeispiel, wie sich mit Mootools ein Login-Formular mit Slide-Funktion (Anzeigen und Verstecken) erzeugen lässt. Das Tutorial ist sehr gut und verständlich erklärt. Ein weiteres Tutorial zeigt auch, wie diese Slide-Login-Funktion direkt in Wordpress integriert und umgesetzt wird.

Demo: Slide Login Panel

html structur mootool login

Umsetzung von Image Sliders per JavaScript-Framework

Ein interessantes Tutorial zur Umsetzung eines beweglichen Sliders mit horizontaler Scroll-Funktion stellt woork.blogspot.com zur Verfügung. In diesem Beispiel wird das JavaScript-Framework Mootools verwendet.

In einem weitern Tutorial von cssglobe.com wird ein einfacher Image oder Content Slider mit einem jQuery Plugin umgesetzt.

Für den bereits bekannten Coda Slider gibt es mittlerweile ein Drupal-Modul das sehr gut funktioniert.

Slider Mootools tutorial

 

Fluid 960 Grid System

Stehpen Bau hat für die schnelle Entwicklung eines interaktiven Web-Protoypes ein Fluid System erschaffen.  Dabei baute er eine Bibliothek mit den herkömmlichen verwendeten HTML-Elementen und kombinierte diese mit CSS für entsprechende Typo und Layouts.

Letztendlich kreierte er das Fluid 960 Grid System Template (960 Pixel fixed mit 12-Splaten, 12-Spalten fluid und 16-Spalten fluid) welches auf der Arbeit von Nathan Smith und seinem 960 Grid System basiert. Die Effekte des interaktiven Grids basieren dabei auf der JavaScript Bibliothek von Mootools.

Dynamic Grid CSS Framework

Freie Hintgrundbilder für die Website

Auf der Website von AVA7 Patterns werden Hintergrundbilder für die Website zum freien Download angeboten. Über 150 Design-Patterns werden bisweilen zur Verfügung gestellt. Jeweils vier Hintergrundbilder werden dabei immer als Vorschau angezeigt. Wenn man im Firefox Browser (nicht IE)  auf “Preview” klickt, werden die Vorschaubilder gleich im Hintergrund angezeigt.

ava7 hintergrungbilder

Slideshow mit s3Slider jQuery Plugin

Schicke s3Slider jQuery Slideshow von JonDesign´s. Hierzu wird nur das jQuery Plugin und das erstellte Script benötigt. Das Script ist linzensiert für Crative Commons Attribution 2.5. Somit kann es für alle Projekte (auch kommerzielle) angewendet werden. Das Plugin wurde an Firefox, Opera, Internet Explorer und Google Chrome getestet.

s3Slider Slideshow

Freies CSS Drop-Down Menu Framework

Mit dem freien CSS Drop-Down Menu Framework lässt sich innerhalb von wenigen Minuten ein schönes Drop-Down Menu erstellen. HTML und CSS werden bei der Anpassung getrennt ausgegeben. Der Code ist leicht anpassbar und kann somit einfach in das bestehende CMS integriert werden. Das Menu funktioniert bei den Browsern: IE, Firefox, Opera und Safari. Für den IE6 wird die Drop-Down Funktion mit JavaScript  unterstützt - ansonsten reines CSS.

freies drop down menu

Jetzt kostenlos Mitglied werden!

Als registriertes Mitglied kannst du Dir dein eigenes Profil anlegen und werbungsfrei noopsta News lesen und zusammenstellen. Du kannst Deine eigene Blogbeitrage verfassen und diese parallel in Twitter  oder Facebook veröffentlichen und vieles mehr ...

Mitglied?