Monat: Januar 2011

Facebook Like Button XFBML in validem XHTML 1.1 – Version 4.0

Es ist wieder soweit. Eine neue und vielleicht letzte Version des beliebten Facebook Object Validation Scriptes ist verfügbar. Damit lassen sich XFBML Tags von Facebook (z.B. Like-Button) auch in XHTML 1.1 W3C-Konform einbinden. Lasst euch überzeugen, denn die Neuerungen sprechen für sich.

Was ist neu?

Dieses neue Facebook Object Validation Script stellt alle Vorgänger in den Schatten. Die Neuerungen betreffen den Rechenaufwand des Besuchers sowie die Dateigröße der JavaScript Datei.

Dateigröße: Wie schon in Version 2 ist die Dateigröße sehr gering – es sind gerade einmal 930 Byte. Hinzu kommen keine weiteren JavaScript Dateien.

Funktion: In der neuen Version wird nicht einfach alles ersetzt wie in unserem Vorgänger, der Version 2. Auch wird nicht nach einer zusätzlich angegeben Klasse gesucht wie in Version 1 und Version 3.

Es werden vordefinierte Standard-Tags gesucht (div, span, p, ul, li – Die Liste kann natürlich in der JavaScript Datei erweitert werden) und geschaut ob in den gefunden Tags ein <!– FBML xxx FBML –> existiert. Existiert nun kein XFBML Object in dem gefunden Tag, wird dieses verworfen und weiter gesucht. Existiert ein Object wird es sichtbar gemacht.

Weiterlesen

Klick-Zähler für HTML Links im Facebook-Style

Mit unserem neuen Script könnt ihr sehen wie oft bestimmte Links oder Downloads angeklickt wurden. Dieses Script verwenden wird auch bei uns im eigenen Blog und ist euch bestimmt schon einmal aufgefallen. Schicke Counts im Facebook Stil!

Unsere Idee war es ein Script zu entwicklen, welches die Anzahl der Klicks auf einen Link oder Download anzeigt. Am besten im schicken und modernen Facebook Like-Button Stil.

Es ist uns gelungen ein solches Script zu erstellen und möchten euch dieses natürlich nicht vorenthalten.


Update

Nun gibt es den Download Counter auch für jQuery!


Die Funktion

Nach dem Einbinden unseres JavaScripts sowie Mootools muss dem Link im Prinzip nur noch die Klasse class=“downloadCounter“ mitgeteilt werden. Danach werden ein paar Elemente, welche Ihr mittels CSS auf eure eigenen Bedürfnisse anpassen könnt angehangen und die entsprechende Funktion vollautomatisch hergestellt.

Weiterlesen

Mit CSS angepasste Select- und Checkboxen: So geht’s!

Dass insbesondere Select-Boxen in HTML so gut wie nicht mit CSS Befehlen angepasst werden können ist wahrscheinlich jedem bekannt. Dennoch haben wir uns um eine vernünftige Lösung dieser Eigenheit gekümmert, welche wir euch Heute präsentieren. Zudem ist es nun möglich auch Checkboxen mit eigenen Grafiken zu versehen.

Select-Boxen können im Normalfall nur minimal mit CSS angepasst werden, sehen in nahezu jedem Browser anders aus und passen optisch des öfteren einfach nicht zum Rest der Formular-Elemente.

Das leidige Thema „Select-Boxen anpassen“ hat nun endlich ein Ende.

Wir haben ein Script entwicklet, welches dieses Thema nun endgültig bequem und nahezu vollautomatisch löst. Das vorgestellte Script basiert auf JavaScript und Mootools, somit ist das Select- und Checkbox-Styling nur für Besucher mit aktiviertem JavaScript sichtbar. Für alle anderen nutzer bleiben natürlich die Original-Elemente erhalten.

Weiterlesen