de.hideout-lastation.com
Paradies Für Designer Und Entwickler


Erstellen Sie in Pure CSS mit Wenk Tooltips

Mit solch einem seltsamen Namen würden Sie von Wenk, einer kostenlosen CSS-Tooltip-Bibliothek, nicht viel erwarten. Aber es ist eine der kleinsten Bibliotheken, die man mit weniger als 1KB beim Zippen bekommen kann.

Wenk verwendet reines CSS mit den Attributen data data-*, um Live-Tooltips zu erstellen, die Sie nach Ihren Wünschen neu positionieren und positionieren können. Das Beste ist, es ist eine komplett kostenlose Bibliothek mit Quellcode auf GitHub.

Diese leichten Tooltips sind sehr einfach zu Ihrer Website hinzuzufügen. Sie benötigen nur die Wenk.css Datei, die zu Ihrem Seitenkopf hinzugefügt wurde, den Sie im GitHub- Wenk.css herunterladen können.

Oder Sie könnten sogar die CDN-Datei hinzufügen, die auf GitHubs CDN gehostet wird. Hier ist der Code dafür:

Oder, wenn Sie ein npm / Bower Fan sind, können Sie dieses Paket vom Terminal installieren.

Die standardmäßigen QuickInfo-Tags haben nicht viele benutzerdefinierte Daten. Sie können die Position und die Breite auswählen, aber Sie müssen das CSS manuell ändern, wenn Sie sie anders gestalten möchten.

Beispielsweise möchten Sie möglicherweise einen CSS-Pfeil zur QuickInfo hinzufügen, der über dem QuickInfo-Element angezeigt wird. Dies ist ziemlich einfach zu erstellen, aber Sie müssen das Wenk-Stylesheet durchsuchen, um die existente CSS-Klasse zu finden.

Hier ist ein Beispiel für einen Standardcode für Wenk Tooltips:

 Wenk nach rechts! 

Die Haupt-Wenk-Startseite enthält Live-Demos, die Sie durch Schweben testen können. Dies sind die grundlegendsten Tooltips, die Sie erhalten, aber sie sind perfekt für eine Bibliothek, die weniger als ein Kilobyte wiegt.

Eine wichtige Sache zu berücksichtigen ist Browser-Unterstützung . Alle Versionen von Chrome und Firefox sollten gut funktionieren . Gleiches gilt für Opera 12+ und Opera Mini v8 +. Aber IE8 und IE10 scheinen Probleme beim Rendern dieser Tooltips zu haben. Zum Glück fällt ihr Marktanteil schnell, aber es ist etwas, vor der Verwendung zu berücksichtigen.

Ich bin immer noch erstaunt, wie viel du mit so wenigen KBs machen kannst. Die Wenk-Bibliothek ist ein Beweis für die moderne Frontend-Entwicklung und es zeigt, dass ein wenig viel erreichen kann.

Sie können die gesamte Quelle auf GitHub durchsuchen, zusammen mit Live-Demos und Code-Snippets, um diese Tooltips für Ihre eigene Site einzurichten und zu erstellen.

Diese Netflix Chrome-Erweiterung ermöglicht den Zugriff auf viele versteckte Kategorien

Diese Netflix Chrome-Erweiterung ermöglicht den Zugriff auf viele versteckte Kategorien

Loyale Netflix-Kunden sind sich der Tatsache bewusst, dass der Content-Streaming-Dienst seine Shows und Filme in Kategorien sortiert, die vor der öffentlichen Ansicht verborgen sind . Während Sie auf diese versteckten Kategorien zugreifen können, indem Sie eine bestimmte URL in die Adressleiste eingeben, können Chrome-Nutzer eine Erweiterung installieren, die diesen Prozess vereinfacht .Die

(Tech- und Design-Tipps)

20 kostenlose Ebooks für Social Media Marketer

20 kostenlose Ebooks für Social Media Marketer

Social Media Marketing gewinnt seinen Platz als einer der begehrtesten Berufe in der Online-Welt. Obwohl jeder, der weiß, wie Social Media funktioniert, eine Marke in diesen Netzwerken vermarkten kann . Es gibt jedoch eine Menge an informativem Material zu diesem Thema, einschließlich Cheatsheets und Inforgraphics, aber das nützlichste und umfassendste dieses Materials sind E-Books .So

(Tech- und Design-Tipps)