jQuery TextChange Plugin – Änderungen in Textfeldern erkennen

jQuery TextChange

jQuery TextChange

Das TextChange-PlugIn für jQuery ist eigentlich ein sehr simples, kleines PlugIn das nicht wirklich viel kann. Aber das was es kann in Kombination mit ein paar Zeilen Code kann ungemein praktisch werden ;-)

Das PlugIn erkennt im Grunde "nur" ob sich der Inhalt einer Textbox verändert. Dabei erkennt es sowohl "normale" Änderungen die dadurch entstehen wenn man etwas eintippt als auch z.B. Copy & Paste Aktionen, etc. – auf der Homepage gibt es auch einige sehr praktische Beispiele was man damit anfangen kann (z.B. eine Anzeige wieviel man schon getippt hat im Twitter-Stil, automatisches Zwischenspeichern von Text per AJAX, usw.).

Im Grossen und Ganzen ist das PlugIn eine wirklich praktische Sache.

VisualSearch.js – die etwas andere Art zu suchen

VisualSearch in Aktion

VisualSearch in Aktion

VisualSearch zu erklären ist ein bisschen komplizierter: stellt Euch vor ihr betreibt eine Website die ein Restaurantführer ist. Natürlich braucht man bei sowas auch eine vernünftige Suchfunktion. Die übliche Vorgehensweise wäre nun, über die normale Suchfunktion einen Begriff im Namen oder im Ort der Restaurants zu suchen und ggf. zusätzlich eine erweiterte Suche anzubieten die mehr Möglichkeiten bietet die Ergebnisse zu filtern.

VisualSearch erlaubt es nun, eine Textbox so zu erweitern, dass schon dort relativ komfortabel weitere Angaben gemacht werden können. Angenommen man möchte, dass Benutzer gezielt schon in der normalen Suche nach Stadt und z.B. akzeptierter Kreditkarte suchen können erweitern. Dann könnte man mit VS es so einrichten, dass ein User sobald er in der Suchmaske ein "s" eintippt ein Drop-Down mit “Stadt” zu sehen bekommt – wählt er das aus erscheint in der Suchmaske "Stadt:" und er kann aus einer Liste auswählen oder einen Wert eingeben. Ähnliches könnte man nun machen wenn er ein "K" eingibt (für die Kreditkarte). Das klingt alles ein wenig verwirrend – am Besten ihr schaut es euch mal auf der Seite an.

Meiner Meinung nach ist das eine ziemlich clevere Art zu suchen.

loads.in – Von über 50 Orten aus testen wie schnell eine Seite lädt

loads.in

loads.in

Manchmal kann es interessant sein zu wissen, wie schnell oder langsam eine Website aus verschiedenen Länder heraus geladen wird.

Für genau diese Aufgabe gibt es mit loads.in ein sehr praktisches Tool. Auf der Seite gibt man eine beliebige URL ein und der Dienst lädt diese Seite dann in verschiedenen Browsern und von verschiedenen Ländern aus.

Nach einigen Sekunden Wartezeit gibt das System dann eine durchschnittliche Zeit aus und man kann sich dann die verschiedenen Ergebnisse anschauen.

(( Der Artikel ist noch vom März – aus irgendeinem Grund hatte ich den als "Seite" in WordPress angelegt statt als Artikel. Ist mir jetzt erst aufgefallen. ))

Symphony of Science – Musik & Wissenschaft

Heute möchte ich euch ein meiner Meinung nach geniales Projekt vorstellen: Symphony of Science.

Der amerikanische Musiker John Boswell mixt dabei Zitate von Wissenschaftlern (Stephen Hawking, Richard Feynman, Carl Sagan und viele mehr) mit elektronischer Musik um wie er es ausdrückt “wissenschaftliche Erkenntnisse und Philiosophie durch musikalische Remixe zu verbreiten”.

Angefangen hat das Ganze 2009 auf YouTube mit “A Glorious Dawn”:

das mittlerweile fast 6 Millionen Views erreicht hat.

Wer einigermassen englisch kann, Wissenschaft und elektronische Musik mag sollte sich die Songs mal anhören (bzw. die Videos anschauen – die sind auf YouTube zum Teil auch mit deutschen Texten versehen) ;)

Sprite Cow – Tool für die Erstellung von CSS Sprites

Sprite Cow

Sprite Cow

Wer das Blog schon ein wenig länger liest wird bemerkt haben, dass ich mich im Allgemeinen bemühe Lösungen vorzustellen die auf möglichst allen grossen Browsern funktionieren. Bei Sprite Cow mache ich da mal eine kleine Ausnahme weil die Seite einfach zu praktisch ist um sie nicht vorzustellen ;-)

Bei Sprite Cow kann man ein Bild hochladen und daraus dann CSS-Sprites generieren (wenn man Firefox oder Chrome benutzt!). Das Ganze funktioniert dabei halb-automatisch. Angenommen man lädt eine PNG-Datei hoch auf der Sprites mit transparentem Hintergrund platziert sind und klickt nun eine der Grafiken an, dann ermittelt Sprite Cow automatisch die genaue Höhe und Breite und gibt die entsprechende CSS-Definition aus. Das ist ungemein praktisch wenn man eine Grafik mit unterschiedlich grossen Sprites hat. Je nach Grafik klickt man einfach nur kurz eines der Elemente an oder legt einen groben Rahmen per Drag & Drop um den Teil einer Grafik den man als Sprite nutzen möchte und Sprite Cow ermittelt die genaue Grösse.

Am Besten ihr geht einfach mal auf die Seite und klickt auf den "Load Example" Button – dann wird ganz schnell klar wie es funktioniert ;-)

Seite 7 von 164« Erste...56789102030...Letzte »