21 Nov

Einfaches CSS Image-RollOver ohne Javascript

Hier ein kleines CSS Snippet, was man sicher öfter mal gebrauchen kann. Mit diesem Snippet erreicht man ein simples Imgage-RollOver, wo das Bild durch ein anderes ausgetauscht wird, wenn man mit der Mouse drüber fährt. Einfach deshalb, weil man sonst immer nur Beispiele mit fetten Javascriptcode findet, wenn man das mal braucht…

 

1
<a title="Facebook" class="img_rollover" href="http://www.facebook.com/MarioPriebe"></a>
1
2
3
4
5
6
7
8
9
10
/*CSS für ImageRollOver  */
a.img_rollover:link, .img_rollover{
	width:32px;
	height:32px;
        display:block;
	background-image:url(images/icon32_facebook_off-2.png);
}
a.img_rollover:hover{
	background-image:url(images/icon32_facebook_on.png);
}

Möchte man mehrere Icons / Images nebeneinander abbilden, setzt man noch ein float:left; in die Definition.

Viel Spaß beim entwickeln : )

23 Sep

Einführung HTML 5 Video

Das Google Dev Team hat ein >40Minütiges Video bereitgestellt, in dem etwas Geschichte über die Entwicklung im Web gesprochen wird und wo es hinführen wird.

Was sind wichtige Features und was bringen die Neuerungen durch  HTML5. All das wird geballt an zahlreichen Demos und anhand von jede Menge Code-Beispielen erklärt.

01 Jul

Golem Video XHTML valide einbinden

Hin und wieder embedded man ja mal ein Video in sein Blog. Wie man das XHTML valide macht, habe ich ja schon öfter beschrieben. Dazu gibt es aber auch eine komfortablere Lösung, und zwar das Plugin “Viper Video Quicktags“.

Leider kann das Plugin keine simplen swf Dateien einbinden und so kam es, dass nach dem Einbinden vom einem GolemVideo, es im Validator mit 25Fehlern “knallte”.

Nun, wer das grüne Favicon liebt, kann sich zum swf / Video einbinden, folgenden Code in seinen Bookmarks speichern ; )

1
2
3
4
5
<object type="application/x-shockwave-flash" data="http://video.golem.de/player/videoplayer.swf?id=2174&autoPl=false" width="480" height="270">
  <param name="src" value="http://video.golem.de/player/videoplayer.swf?id=2174&autoPl=false" />
  <param name="AllowFullScreen" value="true" />
  <param name="AllowScriptAccess" value="always" />
</object>
14 Feb

5 unbekannte HTML Tags

Ja es gibt noch den einen oder anderen HTML Tag, den man nicht wirklich kennt oder eher selten benutzt.

instantfundas.com stellt fünf dieser vor. Den, den ich nicht kenne ist dieser hier der das Eingeschlossene komplett umdreht… coole Spielerei bei der sogar das W3C mitmacht : )

 

<bdo dir="rtl">text</bdo>

Example

Mal sehen ob Du das lesen kannst.