Das Dock von OS X in JavaScript nachgebaut für die eigene Website. Hatte ich früher schonmal gesehen, jetzt sieht der Zoom aber wesentlich flüssiger und die Zwischengrößen der Icons geglättet aus.
Und hier CoverFlow von OS X fürs Web. Diesmal allerdings für MooTools. Auch schön flüssig und ohne Aliasing-Effekte. Sogar skinable für verschiedene Looks.
Unter Bewegungsparallaxe versteht man in der Wahrnehmungspsychologie den Effekt, der sich optisch ergibt, wenn verschiedene Objekte unterschiedlich von einander entfernt in einer Landschaft verteilt sind und sich der Beobachter parallel zu diesen Objekten seitlich fortbewegt und dabei in Richtung Horizont blickt. Dieser Effekt tritt beispielsweise auf, wenn man aus dem Seitenfenster eines fahrenden Autos oder Zuges schaut. Wikipedia
Das JavaScript-Widget „jParallax“ simuliert den Parallaxe-Effekt durch teiltransparente Bilder, die sich in unterschiedlicher Geschwindigkeit zueinander bewegen, wenn man mit der Mause darüber fährt. Ganz anzuschauen, außer um es ins Layout zu integrieren, fällt mir eine geeignete Verwendung im Augenblick nicht ein. Was man zumindest feststellen kann ist, dass heutzutage immer mehr Dinge mit JavaScript gelöst werden, für die früher nur Flash in Frage kam. Schön.
Da es auf der Basis von jQuery geschrieben ist, lässt sich das Widget leicht nutzen, anpassen und erweitern.
Bei Google Code gibt es das Syntaxhighlighter-Projekt, eine JavaScript-API die Quellcode-Syntax verschiedenster Sprachen auf Websites farbig darstellt (siehe Artikel „SyntaxHighlighter macht Quellcode schön„). Das Parsen des Code, um diesen einfärben zu können läuft dabei in der JavaScript-Engine des Browsers, also beim Client ab. Das spart zwar Rechnenkapazität auf dem Server, jedoch ist JavaScript in den Browsern der Generation vor Chrome nicht sehr performant. Am ehesten merkt man dies beim Einsatz des Google Syntaxhighlighters im Internet Explorer kleiner 7 beim Parsen mittelgrößer Code-Stücke. Fehlermeldungen, dass Skripte nicht zum Ende kommen und einfrierende Browserfenster sind die Folge.
Eine brauchbare Alternative stellt highlight.js von Software Maniacs dar. Diese JavaScript-Bibliothek funktioniert analog zu der von Google Code, jedoch ist sie weit performanter. Zwar lassen sich die Browsermeldungen nicht ausschließen, jedoch treten diese erst bei weit größeren Codeblöcken auf. Highlight.js ist mittlerweile auch Bestandteil des JavaScript-Framework Dojo.
Von dem erst 17-jährigen argentinischen Web-Entwickler Guillermo Rauch stammt ein Nachbau der JavaScript-Slideshow, die der eine oder andere von Obama’s Wahlkampfwebsite kennt. Mit „BarackSlideshow“ lassen sich Bilder nacheinander abspielen, der Titel des jeweils aktuellen Bildes wird rechts daneben durch einen wandernden Pfeil und ggf. durch eine andere Formatierung hervorgehoben:
Shiftzoom ist eine JavaScript-Tool, mit dem sich Bilder in einem Rahmen vergrößern (und verkleinern) lassen und bewegen lassen. Diese Navigation kennt man beispielsweise von Google Maps. Das eignet sich deshalb insbesondere für die Darstellung von Kartenmaterial oder für extrem hochaufgelöste Bilder:
Hyphenator ist ein Google Code Projekt, das per JavaScript eine Silbentrennung in die eigene Website bringt. Einfach API in die Seite einfügen und Silbentrennung starten:
Jetzt muss man nur noch den Elementen der Seite, auf die die Silbentrennung angewendet werden soll, die CSS-Klasse class="hyphenate" zuweisen. Explizit verhindern lässt sich die Trennung per class="donthyphenate".
Google bietet den kostenlosen Dienst „AJAX Libraries API“ an, mit dessen Hilfe sich über JavaScript automatisch ein oder mehrere bekannte JavaScript-Frameworks laden lassen. jQuery, prototype, script.aculo.us, mootools oder dojo lassen sich somit mit einer Zeile JavaScript-Code vom Google-Server laden.
Der Vorteil ist: Der Webbrowser des Besuchers meiner Seite lädt sich die gewünschten JavaScript-APIs direkt vom Google-Server anstatt meinen eigenen Webserver mit dem verhältnismäßig hohen Traffic der JavaScript-Dateien zu belasten. Zudem lässt sich die gewünschte Version des einzubetteten Scriptes einfach per Parameter bestimmen und schnell austauschen oder upgraden.
Der „syntaxhighlighter“ von Google Code ist ein freies Skript, um die Syntax der Sprachen C++, C#, CSS, Delphi, HTML, Java, JavaScript, PHP, Python, Ruby, SQL, VB und XML iauf Websites farbig darzustellen. Der Highlighter ist vollständig in JavaScript geschrieben, arbeit rein clientseitig und lässt sich per CSS anpassen.
Hier ein Beispiel in der Sprache CSS zur Demonstration der Auszeichnung. Weiterlesen »
Mit Hilfe dieser Erweiterung für das Weblog-System „WordPress“ lassen sich eingebundene Bilder mit dem von Torstein Honsi bekannten JavaScript Tool „Highslide JS“ vergrößern. Kein aufwändiges Hinzufügen irgendwelcher Quicktags, von JavaScript o.ä. – einfach eine Null-Klick-Lösung! Weiterlesen »
Wir verwenden Cookies auf unserer Website. Wenn Sie auf "Alle akzeptieren" klicken, stimmen Sie der Verwendung von allen Cookies zu. Sie können jedoch unter "Einstellungen" nur bestimmte Zustimmungen erteilen.
Diese Website verwendet Cookies, um das Surferlebnis zu verbessern. Technisch notwendige Cookies werden automatisch von Ihrem Browser gespeichert, da sie für das Funktionieren der grundlegenden Funktionen der Website unerlässlich sind. Wir verwenden auch Cookies von Drittanbietern, die uns helfen zu analysieren und zu verstehen, wie Sie diese Website nutzen. Diese Cookies werden nur mit Ihrer Zustimmung in Ihrem Browser gespeichert. Sie haben auch die Möglichkeit, diese Cookies abzulehnen. Das Ablehnen einiger dieser Cookies kann jedoch Ihr Surferlebnis beeinträchtigen.
Technisch notwendige Cookies sind für das ordnungsgemäße Funktionieren der Website erforderlich. Diese Cookies gewährleisten grundlegende Funktionalitäten und Sicherheitsmerkmale der Website und sind anonymisiert.
Cookie
Dauer
Beschreibung
cookielawinfo-checkbox-advertisement
1 year
The cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Advertisement".
cookielawinfo-checkbox-analytics
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-functional
11 months
The cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-others
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-performance
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
MATOMO_SESSID
session
This cookie is set by the Matomo. This cookie is set when Matomo opt-out feature is used. This is a temporary cookie, it is also called as nonce and helps prevent CSRF security issues.
viewed_cookie_policy
11 months
The cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
Werbe-Cookies werden verwendet, um Besuchern relevante Werbung und Marketing-Kampagnen anzubieten. Diese Cookies verfolgen Besucher über Websites hinweg und sammeln Informationen, um maßgeschneiderte Werbung bereitzustellen.
Cookie
Dauer
Beschreibung
ab
1 year
This domain of this cookie is owned by agkn. The cookie is used for targeting and advertising purposes.
CMID
1 year
The cookie is set by CasaleMedia. The cookie is used to collect information about the usage behavior for targeted advertising.
CMPRO
3 months
This cookie is set by Casalemedia and is used for targeted advertisement purposes.
CMPS
3 months
This cookie is set by Casalemedia and is used for targeted advertisement purposes.
CMST
1 day
The cookie is set by CasaleMedia. The cookie is used to collect information about the usage behavior for targeted advertising.
DSID
1 hour
This cookie is setup by doubleclick.net. This cookie is used by Google to make advertising more engaging to users and are stored under doubleclick.net. It contains an encrypted unique ID.
i
1 year
The purpose of the cookie is not known yet.
id
1 year 1 month
The main purpose of this cookie is targeting and advertising. It is used to create a profile of the user's interest and to show relevant ads on their site. This Cookie is set by DoubleClick which is owned by Google.
IDE
1 year 24 days
Used by Google DoubleClick and stores information about how the user uses the website and any other advertisement before visiting the website. This is used to present users with ads that are relevant to them according to the user profile.
KADUSERCOOKIE
3 months
The cookie is set by pubmatic.com for identifying the visitors' website or device from which they visit PubMatic's partners' website.
KTPCACOOKIE
1 day
This cookie is set by pubmatic.com for the purpose of checking if third-party cookies are enabled on the user's website.
mc
1 year 1 month
This cookie is associated with Quantserve to track anonymously how a user interact with the website.
mdata
1 year 1 month
The domain of this cookie is owned by Media Innovation group. This cookie registers a unique ID used to identify a visitor on their revisit inorder to serve them targeted ads.
ov
1 year 1 month
This cookie is set by the provider mookie1.com. This cookie is used for serving the user with relevant content and advertisement.
pxrc
2 months
The purpose of the cookie is to identify a visitor to serve relevant advertisement.
rlas3
1 year
The cookie is set by rlcdn.com. The cookie is used to serve relevant ads to the visitor as well as limit the time the visitor sees an and also measure the effectiveness of the campaign.
test_cookie
15 minutes
This cookie is set by doubleclick.net. The purpose of the cookie is to determine if the user's browser supports cookies.
uid
1 year 1 month
This cookie is used to measure the number and behavior of the visitors to the website anonymously. The data includes the number of visits, average duration of the visit on the website, pages visited, etc. for the purpose of better understanding user preferences for targeted advertisments.
uuid
3 months
To optimize ad relevance by collecting visitor data from multiple websites such as what pages have been loaded.
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Cookie
Dauer
Beschreibung
__gads
1 year 24 days
This cookie is set by Google and stored under the name dounleclick.com. This cookie is used to track how many times users see a particular advert which helps in measuring the success of the campaign and calculate the revenue generated by the campaign. These cookies can only be read from the domain that it is set on so it will not track any data while browsing through another sites.
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Cookie
Dauer
Beschreibung
na_id
1 year 1 month
This cookie is set by Addthis.com to enable sharing of links on social media platforms like Facebook and Twitter
na_rn
1 month
This cookie is used to recognize the visitor upon re-entry. This cookie allows to collect information on user behaviour and allows sharing function provided by Addthis.com
na_sc_e
1 month
This cookie is used to recognize the visitor upon re-entry. This cookie allows to collect information on user behaviour and allows sharing function provided by Addthis.com
na_sr
1 month
This cookie is set by Addthis.com. This cookie is used for sharing of links on social media platforms.
na_srp
1 minute
This cookie is used to recognize the visitor upon re-entry. This cookie allows to collect information on user behaviour and allows sharing function provided by Addthis.com
na_tc
1 year 1 month
This cookie is set by the provider Addthis. This cookie is used for social media sharing tracking service.
ouid
1 year 1 month
The cookie is set by Addthis which enables the content of the website to be shared across different networking and social sharing websites.
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Cookie
Dauer
Beschreibung
d
3 months
This cookie tracks anonymous information on how visitors use the website.