Where is the RED dot?
Let me see, it is not far away.
Information - Hello Welcome
Schiebe-Regler machen Spaß
Bei den Abschnitten 'About', 'Leistungen' und 'Team' sehen Sie einen responsive Jquery Schieberegler, welcher eine unterschiedliche, beliebige Anzahl von Objekten verschiebt. Dieser Schieberegler läßt als zu verschiebenden Inhalt sowohl Bilder als auch Text oder andere Objekte zu. Auch kann man leicht unter dem Bild einen Text schreiben, wie Sie es bei 'Team' sehen.
CSS Box-Fenster
Fenster öffnen auf der selben Seite (inklusive Anleitung):
Nachfolgender Button-Link öffnet ein Fenster per CSS-div-Box, ganz ohne Javascript. Desgleichen beim Button im Abschnitt 'About Us' und 'Leistungen'. Sie können aber auch die Button-Links ohne Box-Fenster öffnen und stattdessen einen normalen Linkverweis nutzen, sehen Sie dazu das Beispiel beim Abschnitt 'Last But Not Least'.
About Us
Hinweis:
Nachstehender Button-Link öffnet per CSS ein Box-Fenster. Duis arcu tortor, suscipit eget, imperdiet nec, imperdiet iaculis, ipsum. Sed aliquam ultrices mauris. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Praesent adipiscing.
Phasellus ullamcorper ipsum rutrum nunc. Nunc nonummy metus.
Nihil nonumes inimicus ne sea, cum oblique eloquentiam definitiones eu, in perpetua persecuti est. No has dicat blandit, sed no facilisi suavitate.
Unsere Leistungen
Am Puls der Zeit:
Wir sind stolz Ihnen folgende Leistungen anbieten zu können. Nachstehender Button-Link öffnet per CSS ein Box-Fenster. Qui animal expetenda no, natum forensibus pri in. Ne mei justo lorem nonumy.
Best Manus manum lavat
Finest Medias in res
Quality in vino veritas
Service Amor vincit omnia
Bene docet, qui bene distinguit
Our Team
Luisa Vogt
Unsere Chefin führt uns liebevoll mit harter geschäftlicher Hand und weichem kollegialen Herzen. Wir wissen die große Verantwortung, die sie für uns gerne trägt, sehr zu schätzen. Danke, Luisa.
Sven Bo Eriksen
Sven ist unser akribischer, erfahrener und überaus netter Buchhalter und stärkt uns im Hintergrund den Rücken, so daß wir uns voll auf die tägliche Arbeit konzentrieren können.
Ella Weber
Unsere Auszubildende Ella ist jetzt schon ein großer Mehrwert für unsere Firma. Sie ist so motiviert, dass Sie sich auch zu Hause am Computer weiterbildet, also keine Frage das wir Sie als Gesellin einstellen werden.
Samira, The Cat
Samira, unsere junge gefleckte Katze ist unser aller Seelentröster. Wir haben Samira im lokalen Tierheim entdeckt und sofort lieb gewonnen. Sie hat sich sehr schnell bei uns eingewönht .Miau! Du kleine starke Tigerin.
Lisa Ida Landruth
Lisa Ida ist unsere Raumpflegerin und eine wesentliche Stütze unseres Erfolgs. All das Chaos das wir anrichten wird durch sie wie mit Zauberhand wieder gerade gerückt. Wow, Lisa Ida, wie machst du das?
Mia Lena Baumann
Unsere langjährige Mitarbeiterin Mia Lena ist aus unserem Laden nicht mehr wegzudenken. Ihre empathische und humorvolle Art machen Sie zum wichtigen Bindeglied zwischen Kunden und Kollegen.
Last But Not Least
Button-Link ohne Boxfenster:
Sie könnnen es sich aussuchen, ob Sie Links per Box-Fenster oder als normalen Link öffen. Hier nachstehend das Beispiel ohne Boxfenster.
Der nachstehende Button-Link verweist auf eine Seite innerhalb dieser Homepage. In diesem Beispiel wird die Seite 'Sextus' (index6.html) geöffnet. Dort gibt es übrigens noch einige Hinweise zu den Bildern und Icons.
Per CSS-div-Box öffnen sich Fenster direkt innerhalb der selben Seite bei Klick auf einigen 'Weiter-Buttons'.
Gerne legen Sie bei Bedarf nach diesem Prinzip weitere neue Fenster an bzw. löschen Sie auch nicht benötigte.
Neue Fenster anlegen
Hinweis: Der fettgedruckte Teil bei den nachfolgenden Code-Beispielen soll Ihnen bereits zeigen, wie Sie ein neues Fenster anlegen bzw. zum vorhandenen Code hinzufügen!
So sieht die Verlinkung bei den Links 'Information' und 'About Us' und 'Leistungen' aus.
So sieht also ein einzelner Text-Link zum Fenster öffnen aus:
HTML
<label for="open-ihr-fenster"><a>Ihr Fenster</a></label>
Dieser Text-Link funktioniert schon prima, aber um gfls. je nach Situation daraus einen Button zu machen, haben wir für die diesbezügliche Formatierung noch unsere CSS-Klassen 'button' und 'mehr_lesen' darum herum gelegt:
HTML
<div class="button"><span class="mehr_lesen">
<label for="open-ihr-fenster"><a>Ihr Fenster</a></label>
</span></div>
Die dazugehörige Einschalt-Funktion dieser Fenster sehen Sie in der CSS-Datei ('boxfenster.css):
Das eigentliche Fenster ist in der HTML-Datei dann wie folgt unter Einbindung eines Fenster-Schließen-Buttons gestaltet, hier am Beispiel des 'Information-Links':
HTML
<div class="schalter">
<input type="checkbox" id="open-information">
<div class="boxfenster">
<div class="boxinhalt">
<label class="button-close" for="open-information"><i class="far fa-window-close"></i></label>
. . . Hier steht der 'Informations Text' . . .
</div></div></div>
Und so würde es entsprechend für ihr neu anzulegendes Fenster aussehen:
HTML
<div class="schalter">
<input type="checkbox" id="open-ihr-fenster">
<div class="boxfenster">
<div class="boxinhalt">
<label class="button-close" for="open-ihr-fenster"><i class="far fa-window-close"></i></label>
. . . Hier steht der Text fuer ihr neues Fenster . . .
</div></div></div>
Box-Fenster About
Nun in pertinax patrioque vel, eum everti detracto no, partem delectus eum in. Mea primis fuisset instructior an, mel quaestio abhorreant cu, ea esse velit ius. Dictas persius cu vix, error nominati platonem ea has, te ius appareat vivendum pertinacia. Cu malis definitionem per, unum definitiones ad sit.
Ad eos justo aperiri, ad graece assentior quo, ad pri clita voluptua definitionem. Senserit philosophia mel et, rebum eripuit definiebas eu cum. No aeque fabulas epicuri mei. Euismod dolores per ex, malis etiam delicatissimi mei ex, an novum cum vulputate eloquentiam.
Veniam officiis assueverit per id, facilisis disputando id eam, vim justo iuvaret atomorum te. Ne qui probo iriure argumentum, elaboraret scribentur et eos, est munere aperiam repudiare an. Est eu aliquip consequuntur, antiopam patrioque mel et, cum ex impetus nominavi.
Some Pics
Box-Fenster Leistungen
Was haben wir zu bieten? Nun in pertinax patrioque vel, eum everti detracto no, partem delectus eum in. Mea primis fuisset instructior an, mel quaestio abhorreant cu, ea esse velit ius. Dictas persius cu vix, error nominati platonem ea has, te ius appareat vivendum pertinacia. Cu malis definitionem per, unum definitiones ad sit.
Weitere Leistungen
Gloria Deus Requiem
Scientia potentia estas
Profundis Documenta Equlibrium
Radius Solventa Est
Unsiversum Terra Sol
Ad eos justo aperiri, ad graece assentior quo, ad pri clita voluptua definitionem. Senserit philosophia mel et, rebum eripuit definiebas eu cum. No aeque fabulas epicuri mei. Euismod dolores per ex, malis etiam delicatissimi mei ex, an novum cum vulputate eloquentiam.
Veniam officiis assueverit per id, facilisis disputando id eam, vim justo iuvaret atomorum te. Ne qui probo iriure argumentum, elaboraret scribentur et eos, est munere aperiam repudiare an. Est eu aliquip consequuntur, antiopam patrioque mel et, cum ex impetus nominavi.
