65 My Favorite Workplace



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , responsive templates , Homepage-Vorlagen,  free download
Responsive Homepage Vorlage , templates , Homepagevorlagen,  free download





Technik

  • Responsive Webdesign: Anpassung/Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC.
  • Mobile-First-Technik.
  • Jquery: Lightbox-Foto-Gallerie. Alle Gallerie-Fotos komplett innerhalb eines neuen Fensters durchsehen bzw. Vor-und Zurück-Schalten.
  • Icon-Font: Font Awesome.
  • Jquery Smooth Scroll To Top. Button, welcher erst später beim Scrollen eingeblendet wird und ein annimiertes Hoch-Scrollen zum Kopf-Bereich der Webseite ermöglicht.
  • Google-Webfonts: Schrift 'Open Sans' im Schriftschnitt 'Light'.
  • CSS-Only-Menü mit Toggle-Schalter. Eine Javascript-freie Lösung, welche eine Funktion per Schalter (an/aus) ermöglicht um das Menü auf mobilen Geräten zunächst zu verstecken.
  • CSS-Menü-Animation: Hineingleiten des Menüs.

Besonderheiten

  • CSS-Animation: Leuchtstoffröhren-Effekt: Kurzes Aufflackern bei Mausberührung.
  • CSS-Animation: Aufblätter-Effekt: Die Links werden nacheinander mit kleiner Verzögerung eingeblendet.
  • Strukturierte Abschnitte

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
66 Launcher COUNTDOWN



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download





Technik

  • Responsive Webdesign: Anpassung/Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC.
  • Mobile-First-Technik.
  • Icon-Font: Font Awesome.
  • Google-Webfonts: Schrift 'Open Sans' im Schriftschnitt 'Light'.
  • CSS-Only-Menü mit Toggle-Schalter. Eine Javascript-freie Lösung, welche eine Funktion per Schalter (an/aus) ermöglicht um das Menü auf mobilen Geräten zunächst zu verstecken.

Besonderheiten

  • Jquery-Animation: Countdown-Zähler.
    Zählt in Tagen, Monaten, Stunden und Sekunden herunter. Das End-Datum, an welchem der Zähler die Null erreicht, stellen Sie ganz leicht im Kopf-Bereich der HTML-Seite ein. Tipp: Verschiebt sich Ihr Projekt dann doch noch einmal kurzfristig, stellen Sie ganz einfach ein neues End-Datum ein und ändern den Text ('Wir starten demnächst').
  • CSS-Animation: Fade-In: Informations-Fenster blendet sich als CSS-Box horizontal und vertikal zentriert hinein.
  • CSS-Animation: Pop-Up-Effekt auf Social Media Icons.

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 29,--
 
67 At The Beach - Am Strand von Summerland
+ ONE-PAGER
+ CSS-Beach-Animation
+ Full-Screen-Only-Site
+ CSS-Box-Fenster



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , responsive templates , Homepage-Vorlagen,  free download
Responsive Homepage Vorlage , templates , Homepagevorlagen,  free download





Technik

  • Responsive Webdesign: Anpassung/Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC.
  • Mobile-First-Technik.
  • CSS-Only-Menü mit Toggle-Schalter. Eine Javascript-freie Lösung, welche eine Funktion per Schalter (an/aus) ermöglicht um das Menü zunächst zu verstecken.
  • CSS-Menü-Animation: Einblenden des Menüs.
  • Jquery: Lightbox-Foto-Gallerie.
  • Icon-Font: Font Awesome.
  • Google-Webfonts: Schrift 'Open Sans' im Schriftschnitt 'Light'.

Besonderheiten

  • CSS-Beach-Animation. 1 Hund, Ball und Schwimmer sind hier am Strand animiert.
  • One-Pager:2 Alle Inhalte innerhalb einer HTML-Seite.
  • Full-Screen-Only-Site. 3
  • CSS-Box-Fenster: Inhaltsfenster als div-Box öffnen sich per Klick innerhalb selben Seite. Dies ist eine Javascript-freie Lösung.

1 = Beach-CSS-Animation:
Strand-Animation per CSS-Keyframes mit Font-Icons: Die Animation beginnn mit einer Verzögerung (delay) von 12 Sekunden für den Schwimmer und 14 Sekunden für den Hund sowie den Ball. Diese Werte sind genauso veränderbar, wie die Anzahl der Durchläufe für die versch. genannten Objekte, welche wir auf eine Anzahl von unter 10 begrenzt haben. Gerne ändern Sie z.B.die Werte mit weitaus mehr oder weitaus weniger Durchläufen oder Sie setzen für einen unendlichen Durchlauf das Schlüsselwort 'infinite'. Übrigens landet der Hund nach dem 'in die Höhe springen' auf ganz realistischer Weise erst auf den Vorderpfoten und danach auf den Hinterpfoten.

2= One Pager:
Dies ist ein responsive One-Pager. Auch bezeichnet als Single-Page-Website. Im Prinzip bedeutet es, das die Webseite nur aus einem einzigen Webdokument, also nur einer HTML-Seite besteht. Klicken Sie die Links im Menü und sehen Sie, wie mittels nur einzigen HTML-Seite die verschiedenen Links als Boxfenster innerhalb der eigenen Seite aufgerufen werden.

3 = Full-Screen-Only-Site:
Volle Bildschirm-Ansicht: Während die Gesamtkonstruktion hier bei allen Auflösungen nicht mitscrollt und immer jeweils responsive das Display ausfüllt, lassen sich die öffnenden Inhalts-Fenster (Box-Fenster) sehr wohl scrollen.

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
68 Favourite Location Tour Guide



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , responsive templates , Homepage-Vorlagen,  free download
Responsive Homepage Vorlage , templates , Homepagevorlagen,  free download





Technik

  • Responsive Webdesign: Anpassung/Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC.
  • Mobile-First-Technik.
  • Jquery: Lightbox-Foto-Gallerie.
  • Jquery Smooth Scroll. Animiertes Scrollen bei allen internen Links möglich, denn der Link muß nur auf eine CSS-ID verweisen.
  • Icon-Font: Font Awesome.
  • Google-Webfonts: Schrift 'ROBOTO LIGHT'.

Besonderheiten

  • Transparenz-Menü.
  • CSS-Animation bei den Font-Icons1
  • Menü bei allen Auflösungen immer sichtbar: Also ohne den sog. Hamburger Button.
  • Font-Icon-Tausch: Im Hauptmenü wird ein Font-Icon (Fontawesome) durch ein anderes gewechselt.

1= Icon-Animation:
Im Kopfbereich sehen Sie verschieden formatierte Font-Icons, wie die Social-Media Icons oder das Kompass-Icon, welches per automatisch startender Animation abwechselnd links und rechts herum dreht. Auch die Icons beim Menü (Location-Arrows) sind bei Mausberührung animiert, indem diese sich in eine horizontale Position drehen.


    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
69 COOL WATER



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download





Technik

  • Responsive Webdesign: Anpassung/Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC.
  • Mobile-First-Technik.
  • Icon-Font: Font Awesome.

Besonderheiten

  • Fixierter Background: Seite scrollt also über den feststehenden Hintergrund.
  • CSS-Animationen: Hoch-Schrauben (= Drehen + Slide-Top - bei Mouseover auf den Icons)

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
70 Success In Job



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download





Technik

  • Responsive Webdesign: Anpassung/Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC.
  • Mobile-First-Technik.
  • Icon-Font: Font Awesome.
  • CSS-Only-Menü mit Toggle-Schalter. Eine Javascript-freie Lösung, welche eine Funktion per Schalter (an/aus) ermöglicht um das Menü auf mobilen Geräten zunächst zu verstecken.

Besonderheiten

  • CSS-Animation: Slideshow (Bildwechsler).
  • Runde Fotos. ( mit CSS-border-radius)
  • CSS-Animation: Drehen (bei Mouseover auf den Fotos im Inhaltsbereich)
  • CSS-Animation: Schweben (automatisch bei Seitenstart auf den Social-Median-Icons)
  • CSS-Animation: Slide-Left (bei Mouseover auf den Social-Median-Icons)

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
71 BUSINESS PRESENTATION



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download





Technik

  • Responsive Webdesign: Anpassung/Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC.
  • Mobile-First-Technik.
  • Icon-Font: Font Awesome.
  • Google-Webfonts: Schrift 'Open Sans CONDENSED' und 'Poiret One'.
  • CSS-Only-Menü mit Toggle-Schalter. Eine Javascript-freie Lösung, welche eine Funktion per Schalter (an/aus) ermöglicht um das Menü auf mobilen Geräten zunächst zu verstecken.
  • CSS-Menü-Animation: Hineingleiten des Menüs.

Besonderheiten

  • Buchdruck (Inset)- Einstanz-Effekt beim Homepagenamen (mit CSS-textshadow)
  • PERSPEKTIVISCHE ROTATION , hier Schrägstellung (mit CSS-perspective/rotate)
  • Schrägen ohne Grafik: (mit CSS-linear-gradient).
  • CSS-Animation GLEITEN, Foto von links nach rechts |startet automatisch
  • CSS-Animation SCALE, vergrössern
  • CSS-Animation SLIDE-RIGHT + FARBÄNDERUNG ICON
  • CSS-Animation GUMMIBAND
  • CSS-Animation ZOOM-IN, in Foto-Box hinein zoomen
  • CSS-Animation PERSPEKTIVISCHES WENDEN auf Y-Ebene
  • CSS-Animation PERSPEKTIVISCHES WENDEN auf X-Ebene
  • Animation PERSPEKTIVISCHES SCHRÄG VERGRÖSSERN
  • CSS-Animation DREHEN
  • CSS-Animation DREHEN + VERKLEINERN
  • CSS-Animation WAEHLSCHEIBE

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
72 Some Nice Places
+ ONE-PAGER
+ Jquery-Fullscreen-Slideshow
+ Full-Screen-Site
+ CSS-Box-Fenster



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download




Technik

  • Responsive Webdesign: Anpassung/Optimierung der unterschiedlichen Bildschirmgrößen von Smartphone, Tablet, Notebook, Laptop und Desktop-PC.
  • Mobile-First-Technik.
  • CSS-Only-Menü mit Toggle-Schalter. Eine Javascript-freie Lösung, welche eine Funktion per Schalter (an/aus) ermöglicht. Hier ist das Menü bei allen Auflösungen immmer sichtbar und verschwindet bei Klick auf den Schalter - und als Besonderheit wird nicht nur das Menü, sondern gleich die gesamte Mittel-Leiste (Homepagename, Menü und Fuss-Menü) nach oben hinaus geschoben.
  • Jquery: Lightbox-Foto-Gallerie.
  • Icon-Font: Font Awesome.
  • Google-Webfonts: Schrift 'Open Sans' im Schriftschnitt 'Light'.
  • CSS-Menü-Animation: Hinaus-Schieben des Menüs.

Besonderheiten

  • Jquery: Slideshow (Automatischer Bildwechsler). Inklusive alternativer Steuerung per Pfeile, welche auch ein manuelles Durschalten der Fotos ermöglichen.
  • Full-Screen-Site. 1
  • Full-Screen-Slideshow. Mit nur einem Klick! Wir haben folgenden CSS-Schalter als Besonderheit hinzugefügt: Klicken Sie das 'Schließen-Icon', so verschwindet die Mittel-Leiste komplett (also mitsamt Name, Menü und Fuss-Links) und wird animiert nach oben hinausgeschoben und Sie haben somit volle Sicht auf die Slideshow. Ein erneuter Klick blendet die Leiste wieder ein.
  • One-Pager:1 Alle Inhalte innerhalb einer HTML-Seite.
  • CSS-Box-Fenster: Inhaltsfenster als div-Box öffnen sich per Klick innerhalb selben Seite. Dies ist eine Javascript-freie Lösung.

1 = Full-Screen-Site:
Volle Bildschirm-Ansicht: Während die Gesamtkonstruktion hier bei allen Auflösungen nicht mitscrollt und immer jeweils responsive das Display ausfüllt, lassen sich die öffnenden Inhalts-Fenster (Box-Fenster) sehr wohl scrollen.

2= One Pager:
Dies ist ein responsive One-Pager. Auch bezeichnet als Single-Page-Website. Im Prinzip bedeutet es, das die Webseite nur aus einem einzigen Webdokument, also nur einer HTML-Seite besteht. Klicken Sie die Links im Menü und sehen Sie, wie mittels nur einzigen HTML-Seite die verschiedenen Links als div-Boxfenster innerhalb der selben Seite aufgerufen werden.

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--