20. Mai 2010
Wer sich schon einmal mit Jquery beschäftigt hat, weiß um die Vorzüge dieses Javascript-Frameworks. Die Bibliothek bietet bereits viele optimierte Methoden zur dynamischen Webseiten-Gestaltung für die eigene Homepage.
Heute zeige ich, wie Ihr mit einfachen Mitteln und ein wenig Programmiererfahrung ein einfaches Ausklappmenu erstellen könnt. Es bleibt Euch natürlich überlassen dieses noch zu verfeinern und weiter zu entwickeln.
Ein dynamisches Ausklapp-Menu könnt Ihr Euch auf dieser Seite anschauen.
-Hier klappt das Menu auseinander und es erscheinen die einzelnen Menupunkte.-
An Hand eines lauffähigen Beispielcodes demonstriere ich nun ein simples Aufklappmenu.
Als erstes erstellen wir die HTML-Elemente
Veröffentlicht in CSS Tips, Tutorials | 2 Kommentare »
27. Oktober 2009
Einer der wichtigsten Teile einer Website ist sicherlich die Navigation und diese ist meistens auch am aufwendigsten zu erstellen. Deshalb ist es besonders wichtig ein übersichtliches und semantisch sauber programmiertes Menü zu erstellen, welches die eine einfache Navigation ermöglicht und den Besucher schnell zu dem gewünschten Ziel führt. Eine Möglichkeit, die Stylesheets bieten sind Listen (UL / LI) um solche Menüs zu erstellen. Hier sind ein paar Beispiele:
Magix: CSS Dropdown Menü
Magix verfügt über eine große Anzahl von Links und verpackt diese in einer optisch sehr ansprechenden und logisch aufgebauten Drop-Down-Navigation. Die fünf Oberkategorien zeigen jeweils verschiedene Unterkategorien, welche alle mit einem Hover-Effekt versehen sind. Dieser Effekt zeigt eindeutig wo man sich befindet und erleichtert so die Navigation.
Veröffentlicht in Design Inspiration, Tutorials | 1 Kommentar »
11. Mai 2009
Permanent link to this post (12 words, 1 image, estimated 3 secs reading time)
Schlagworte: Templates, Weblogs, Wordpress
Veröffentlicht in CSS Tips, How-Tos | Keine Kommentare »
11. Mai 2009
MojoPortal, Wordpress, Drupal, alles drin…..
Klar ist hier die Web Strategie von Microsoft zu sehen….und schlecht soll diese “Web App Gallery” auch nicht sein.
Wer meint in diesem Web Katalog befinde sich nur, wie man annehmen könnte, Applikationen aus dem Microsoftlager, also ASP- und .NET-basiertes, der täsucht sich, denn sogar Web Anwendungen, wie Wordpress, Silverstripe oder Drupal sind in diesem Katalog zu finden. Selbst das aktuelle PHP lässt sich per WPI auftragen.
Das es MS im Bezug auf Web Standards und hohe Skalierbarkeit und Perfomance schwer hat….soll mit dem WPI Rezept und der neuen App Gallery ein Hexkraut geköchelt werden…..
This is a preview of
MS Web Platform Installer bekommt einen Katalog über Web Anwendungen dazu - Web App Gallery
.
Read the full post (137 words, 2 images, estimated 33 secs reading time)
Schlagworte: .NET Framework, Content management, Drupal, gallery, microsoft, PHP, Programming, web app, Wordpress, wpi
Veröffentlicht in How-Tos, Webnews | 1 Kommentar »
23. April 2009
…Jaaaaaaa…auch bei uns wird fleissiger Einsatz gelobt - und belohnt!
Und das gibst zu gewinnen
Wir haben in unserem Forum einen Aktions-Thread eröffnet, in dem Ihr Eure Ideen und Vorschläge einbringen könnt.
Mit diesem Schritt möchten wir Euch an der Weiterentwicklung des Forums beteiligen.
Und das Beste: Ihr könnt auch was gewinnen!
Grübelst du noch oder postest Du schon?
Also registrieren (sofern überhaupt noch nicht geschehen - tze!), posten und mitverbessern!
Vielen Dank vorab schon mal an die Teilnehmer!
Es grüsst Euch
Das CSS-Info - Team
Permanent link to this post (86 words, 1 image, estimated 21 secs reading time)
Schlagworte: forum, mit-mach-aktion
Veröffentlicht in Design Inspiration | Keine Kommentare »
30. März 2009
Oi!
habe soeben ein nützliches CSS Cheat Sheet auf AddedBytes gefunden, welches auf den ersten Blick sehr nützlich sein kann, und einen gute groben Überblick der Möglichkeiten von CSS darstellt.
Permanent link to this post (32 words, 1 image, estimated 8 secs reading time)
Schlagworte: css cheat scheet
Veröffentlicht in CSS Tips | 1 Kommentar »
27. März 2009
Image by Somewhat Frank via Flickr
Seit einiger Zeit gibt es die kostenlose Online Alternative zu Guitar Hero namens JamLegend. Ähnlich wie die Spiele Guitar Hero und Rock Band, simuliert JamLegend den Nervenkitzel vor einer ausverkauften Menge zu rocken.
Dazu ist natürlich diese Webseite auch ein Paradebeispiel für gutes Design und intuitive Bedienung für den Tastatur Rocker ;). Die Hauptanwendung ist mittels Adobe Flex realisiert und ist fast so üppig wie die Spiele auf den Konsolen, und das alles im Browser…..einfach genial.
In diesem Sinne viel Spass!
Link: JamLegend.com
Permanent link to this post (91 words, 2 images, estimated 22 secs reading time)
Schlagworte: Design, Music
Veröffentlicht in Design Inspiration | Keine Kommentare »
26. März 2009
Image by PeterForret via Flickr
Wer kennt es nicht? Wireframes erstellen ist ja schön und gut, jedoch die richtige Farb-Atmosphäre zu erstellen ist oftmals sehr schwer….
Heute möchte ich euch 2 nette, kleine aber wie so oft feine Tools präsentieren:
A) Color Scheme Designer:
Einfach Tool! Ohne viele Worte zu verlieren, ist man mit diesem online Tool in der Lage, schnell monochrome, komplemetäre und analoge Farb-Gestaltungen zu erhalten. Das Tool ist mit einer gehörigen Portion Javascript (Jquery ist nat. auch dabei) und viel Liebe und Kaffee von Petr Stanicek entwickelt worden, und gehört ab sofort zu meinen lieblings Bookmarks.
This is a preview of
Wie kann ich mein Farb-Schema sorgfältig auswählen?
.
Read the full post (156 words, 2 images, estimated 37 secs reading time)
Schlagworte: Adobe Kuler, color scheme, Design, inspiration, web development
Veröffentlicht in CSS Tips, Design Inspiration | 1 Kommentar »
25. März 2009
Hallo!
seit gestern gibt es das alt-bekannte CSS Info Forum im neuen Gewand. Hier findest Du Tipps und Hilfe bei Fragen zu dem Thema Cascading Style Sheets.
Das Forum dient dazu Fragen zu veröffentlichen und mit anderen Mitgliedern deine CSS-Probleme und - Ansätze zu besprechen und am besten zu lösen.
Wir hoffen es gefällt euch und wünschen euch viel Spass beim suchen und posten.
Vorher
Before Relaunch
Nachher
After Relaunch
Permanent link to this post (71 words, 2 images, estimated 17 secs reading time)
Schlagworte: relaunch css forum
Veröffentlicht in Design Inspiration | 1 Kommentar »
25. März 2009
Salve! anbei findet ihr hier meinen Tip für heute: Der Yaml Builder.
Der YAML Builder ist ein Werkzeug zur Erstellung von CSS-Layouts. Er erlaubt die Einstellung grundlegender Layouteigenschaften, die Anzahl und Positionierung der Content-Spalten, sowie die dynamische Erstellung Grid-basierter Layouts auf Basis der Subtemplates per Drag & Drop. Nicht ganz WYSIWYG, aber nahe dran!
aktuelle Version steht hier zum download bereit.
Permanent link to this post (63 words, 2 images, estimated 15 secs reading time)
Schlagworte: Cascading Style Sheets, CSS, Data Formats, Examples, Style sheet, Web design, Website, YAML
Veröffentlicht in CSS Tips, How-Tos | 1 Kommentar »
Frage stellen
