Biggle's Blog

Web- und Software Development

Nov
21

by Mario Priebe

Einfaches CSS Image-RollOver ohne Javascript

Category: (X)HTML, CSS Tags: 2 Comments

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 : )

Jan
15

by Mario Priebe

CSS Klassen filtern mit PrimerCSS

Category: (X)HTML, CSS, MarkUp Tags: , Leave a Comment

Mit PrimerCSS kann man aus fertig geschriebenen HTML Code die CSS Klassen und IDs filtern. Damit ist es z.B. möglich die HTML zu schreiben, Klassen und IDs zu setzen und danach dann, die entsprechende CSS zu implementieren.

Sep
23

by Mario Priebe

Einführung HTML 5 Video

Category: (X)HTML, Development, MarkUp Tags: , , Leave a Comment

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.

Jul
1

by Mario Priebe

Golem Video XHTML valide einbinden

Category: (X)HTML, MarkUp Tags: 1 Comment

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>

Apr
9

by Mario Priebe

CSS Naked Day

Category: (X)HTML, CSS Tags: 2 Comments

Jo, wer ein reines Gewissen hat darf mitmachen : )

Feb
14

by Mario Priebe

5 unbekannte HTML Tags

Category: (X)HTML, MarkUp Tags: Leave a Comment

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.

« Older Posts