JavaScript-Elemente sind eine tolle Möglichkeiten, um deine Portfolio-Webseite aufzupeppen und deine Arbeitsproben angemessen zu präsentieren. So kannst du beispielsweise einen Featured Work-Slider integrieren, oder Detailansichten deiner Arbeiten in einer Lightbox aufbereiten. Mit diesen 10 modernen JavaScript-Plugins solltest du auf jeden Fall gerüstet sein, das Beste aus deinem Portfolio herauszuholen.
1. Slidedeck
Ein sehr schöner Content-Slider im Accordion-Style. Slidedeck eignet sich super für eine Featured Projects.
2. Flip
Ein bisschen drehen und wenden gefällig? Mit Flip kannst du deine Projekte mit einer spannenden Animation präsentieren.
3. qtip
Egal ob Bilder oder Infotext, die qtips sehen schick aus und sind praktisch, um zusätzliche Inhalte unterzubringen.
4. Quicksand
Möchtest du deine Projekte nach Themen sortieren? Dann ist das Quicksand-Plugin genau das Richtige für dich. Ein wunderschönes Beispiel kannst du dir z.B. auf der Portfolio-Seite von Creative Spark anschauen.
5. Nivoslider
Nivoslider ist wohl der schönster jQuery Bilder-Slider derzeit. Du kannst aus mehreren Überblendungs-Optionen wählen und die Styles mit CSS anpassen.
6. Captipy
Mit diesem Plugin kannst du deinen Bildern schön animierte Bild-Unterschriften (Captions) hinzufügen.
7. prettyphoto
Eine der schönsten Lightbox-Varianten mit 5 verschiedenen Styles zur Auswahl.
8. Fancybox
Eine weitere sehr schöne Lightbox-Variante. Du kannst den Effekt wählen, wie deine Bilder eingeblendet werden sollen.
9. Galleria
Galleria ist ein praktisches und super schickes Fotogalerie-Plugin.
10. jQZoom
Mit jQZoom kannst du Detailansichten deiner Bilder per Mouse-Rollover hervorheben.
Beispiele schöner Portfolios
Auf diesen wunderschönen Portfolio-Seiten findest du jede Menge Inspiration, wie du die JavaScript-Plugins verwenden kannst.
1. CPeople
JavaScript-Elemente: Slider, Slide Up/Down
2. Rich Brown
JavaScript-Elemente: Lightbox
3. x3 Studios
JavaScript-Elemente: Carousel Slider
4. Galan Design
JavaScript-Elemente: Slider und Lightbox
5. Kitfolio
JavaScript-Elemente: Featured Slider mit Captions
6. Rokkan
JavaScript-Elemente: Image-Slider
7. Magouya
JavaScript-Elemente: Tooltips und Lightbox
8. dataselected
JavaScript-Elemente: Accordion und Image-Slider
Wie gefallen dir die Plugins und Beispielseiten? Kennst du weitere schöne Portfolio-Webseiten mit JavaScript-Elementen? Über deine Tipps und dein Feedback würde ich mich sehr freuen.
Hallo ihr zwei :) Vielen Dank für diese tolle Zusammenstellung. Wer weiss, vielleicht kann ich ja eines dieser Plugins für mein neues Portfolio verwenden. Vorausgesetzt, ich werde irgendwann fertig damit ;)
Die Beispiele sind auch super. Kitfolio hat es mir besonders angetan.
Liebe Grüsse nach Thailand aus der Schweiz :)
@Barbara: Vielen lieben Dank für deinen Kommentar! Ja, Kitfolio ist wirklich eine tolle Webseite, die Illustrationen gefallen mir sehr. Hehe, das never ending Redesign…da können wir selbst auch ein Lied von singen ;-)
Wir sind schon sehr gespannt auf dein neues Design, wird bestimmt wieder super schön :-)
Ganz viele Grüße nach Switzerland
Ellen & Manuel
Beim 7. Plugin prettyphoto ist das Foto noch mit SlideDeck verlinkt.
@Sebastian: Ups ;-) Vielen Dank für den Hinweis, hab’s gerade korrigiert :-)
Viele Grüße
Ellen
Hallo Ellen,
super schöner Blog! Wurde gerade durch ein t3n Newsletter darauf aufmerksam gemacht.
Die Zusammenstellung ist klasse, für jeden Geschmack was dabei, werde mich an einem oder anderem Beispiel für meine Seite bedienen.
Viele Grüße
Waldi
@Waldi: Vielen herzlichen Dank für dein tolles Feeback und herzliche Willkommen auf dem Elmastudio-Blog :-)
Es freut mich sehr, dass du dir die Plugin-Zusammenstellung gefällt und du auch gleich einige der Plugin verwenden kannst :-)
Viele Grüße
Ellen
Hi Ellen,
hab mir selbst mal den Nivo-Slider auf meiner Page eingebaut und kann den nur empfehlen. Wirklich leicht zu integrieren, total easy anzupassen und ein wirkliches Leichtgewicht (5kb komprimiert) !
Also nur zu empfehlen ;)
Schöne Grüße
Roberto
PS: Das Design Deiner Seite - RESPEKT ! Ich bin ja nur Hobby-Designer ;)
Hallo Roberto,
vielen herzlichen Dank für deinen Kommentar und dein tolles Feedback. Es freut mich riesig, dass dir der Nivo-Slider und auch unser Blog so gut gefallen :-)
Ja, der Nivo-Slider ist genial, und bietet sehr schöne Möglichkeiten für einen Bilder-Slider. Ich habe den Slider auch schon bei Kunden-Webseiten zum Einsatz gebracht und es kam immer super gut an :-)
Viele Grüße,
Ellen
Hallo!
Vielen Dank für diese tolle Liste!
Nur eine kleine Verbesserung: Nr.6 heißt nicht Captipy sondern Captify :D
Gerade das werde ich jetzt mal nutzen…
Gruß Ralf
Hallo Ellen,
sehr schöne Designbeispiele. Übrigens, ich suche eine Möglichkeit, in ein Akkordeonmenü ein Imageslider zu integrieren. Für einen Tipp bin ich dankbar.
Gruß Niko
Hallo,
Bin bei meiner Backlink-Reschersche auf Euch gestossen. Der Besuch war es wert. Schoene Seite und ja auch sehr aktiv und belebt. Viel Erfolg.
Gruss,
Alex aus der Schweiz