marcinex # design // CSS // XHTML // XML // webtools http://blog.marcinex.net Tue, 12 Dec 2006 10:04:24 +0000 http://wordpress.org/?v=2.0.4 en CSS: Transparenz auf DIV-Layern http://blog.marcinex.net/12-12-2006/css-transparenz-auf-div-layern.html http://blog.marcinex.net/12-12-2006/css-transparenz-auf-div-layern.html#comments Tue, 12 Dec 2006 09:54:52 +0000 marcinex CSS http://blog.marcinex.net/12-12-2006/css-transparenz-auf-div-layern.html >transdiv]]> Seit CSS2 ist es nun auch möglich Transparenzen außerhalb der MS-Filter zu nutzen. Das heißt, dass diese auch vom Firefox genutzt werden können.

CSS-code:

#transdiv {
	background-color: #000;
	filter:alpha(opacity=65);  //IE
	opacity:.65;   //Mozilla etc.
}

>>transdiv<< ist besitzt nun einen schwarzen Hintergrund mit einer Deckkraft von 65%.

]]> http://blog.marcinex.net/12-12-2006/css-transparenz-auf-div-layern.html/feed/ GFX: Oh du fröhliche… http://blog.marcinex.net/11-12-2006/gfx-oh-du-frohliche.html http://blog.marcinex.net/11-12-2006/gfx-oh-du-frohliche.html#comments Mon, 11 Dec 2006 13:05:07 +0000 marcinex icon gfx http://blog.marcinex.net/11-12-2006/gfx-oh-du-frohliche.html Brand Spanking New schenkt seinen Usern ein Icon-Set bestehend aus 113 10×10 Pixel Icons in Graustufen!

icons_10x10.gif

Hier geht’s zum Download

]]> http://blog.marcinex.net/11-12-2006/gfx-oh-du-frohliche.html/feed/ PHP: Umlaute in HEX-Code umwandeln http://blog.marcinex.net/01-12-2006/php-umlaute-in-hex-code-umwandeln.html http://blog.marcinex.net/01-12-2006/php-umlaute-in-hex-code-umwandeln.html#comments Fri, 01 Dec 2006 10:22:57 +0000 marcinex Scripte PHP http://blog.marcinex.net/01-12-2006/php-umlaute-in-hex-code-umwandeln.html Hier ist eine kleine Funktion, mit der man Umlaute in HEX-Code umwandeln kann.

PHP-code:

function strip_umlaute($wert){

	$umlaute = Array("/ä/","/ö/","/ü/","/Ä/","/Ö/","/Ü/","/ß/");
	$replace = Array("&auml;","&ouml;","&uuml;","&Auml;","&Ouml;","&Uuml;","&szlig;");
	$wert = preg_replace($umlaute, $replace, $wert);

	return $wert;
}
]]> http://blog.marcinex.net/01-12-2006/php-umlaute-in-hex-code-umwandeln.html/feed/ TinyMCE: Der WYSIWYG Editor http://blog.marcinex.net/01-12-2006/tinymce-der-wysiwyg-editor.html http://blog.marcinex.net/01-12-2006/tinymce-der-wysiwyg-editor.html#comments Fri, 01 Dec 2006 10:08:57 +0000 marcinex Scripte javascript http://blog.marcinex.net/01-12-2006/tinymce-der-wysiwyg-editor.html TimyMCE ist ein platformübergreifender Javascript WYSIWYG HTML-Editor. Er ist leicht zu installieren und sehr benutzerfreundlich.

TinyMCE

Dem Benutzer stehen mehrere Versionen zur Verfügung, dieser reichen von “simpel“, über “advanced” bis hin zu einer Word-ähnlichen Oberfläche.

Das Script wandelt Textareas in eine intuitive Benutzeroberfläche um, dieser simple Code bindet das Tool in eure Seite ein:

HTML-Code:

<html>
<head>
<title>TinyMCE Test</title>
<script language="javascript" type="text/javascript" src="../jscripts/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
	mode : "textareas"
});
</script>
</head>
<body>
<form method="post">
	<textarea name="content" cols="50" rows="15">This is some content that will be editable with TinyMCE.</textarea>
</form>
</body>
</html>

Download: TinyMCE 2.0.8

]]> http://blog.marcinex.net/01-12-2006/tinymce-der-wysiwyg-editor.html/feed/ CSS: Überschrift durch Bild ersetzen, barrierefrei http://blog.marcinex.net/17-11-2006/css-uberschrift-durch-bild-ersetzen-barrierefrei.html http://blog.marcinex.net/17-11-2006/css-uberschrift-durch-bild-ersetzen-barrierefrei.html#comments Fri, 17 Nov 2006 09:10:38 +0000 marcinex CSS http://blog.marcinex.net/17-11-2006/css-uberschrift-durch-bild-ersetzen-barrierefrei.html Mit Hilfe von CSS kann man ganz einfach Text durch ein Bild ersetzen, ohne dass das die Suchmaschinen oder Screenreader stört. Dazu setzt man ein Bild als Hintergrundbild einer Überschrift z.B. H1 und blendet den Text mit einem kleinen Trick aus Das macht man, indem man den “text-indent” (Texteinzug) auf -9000px setzt. Somit ist der Text unsichtbar und wird durch das Hintergrundbild ersetzt.

CSS-code:

h1 {
	background: url(euer_hintergrund_bild.jpg);
	text-indent: -9000px;
	height:50px;
	width:150px;
}

XHTML-code:

<h1>Eure Überschrift</h1>
]]> http://blog.marcinex.net/17-11-2006/css-uberschrift-durch-bild-ersetzen-barrierefrei.html/feed/ PHP: Zeilenfarbe abwechselnd anzeigen http://blog.marcinex.net/15-11-2006/php-zeilenfarbe-abwechselnd-anzeigen.html http://blog.marcinex.net/15-11-2006/php-zeilenfarbe-abwechselnd-anzeigen.html#comments Wed, 15 Nov 2006 14:59:48 +0000 marcinex Scripte PHP http://blog.marcinex.net/15-11-2006/php-zeilenfarbe-abwechselnd-anzeigen.html Es ist immer gut, wenn Zeilen von Tabellenlisten im Wechsel unterschiedliche Zeilenfarben haben, um eine bessere Leserlichkeit und Übersicht zu gewährleisten.

Wenn die Tabellen-Daten aus einer Datenbank kommen können sie einfach mit dem folgenden kleinen Script erstellt werden:

PHP-code:

for($count=0;$count<10;$count++) {

    if($count % 2) { $farbe="#fff"; }
    else { $farbe="#ccc"; } 

	echo "die gewünschte Frabe ist: ".$farbe;

}

]]>
			http://blog.marcinex.net/15-11-2006/php-zeilenfarbe-abwechselnd-anzeigen.html/feed/
		
		
		PHP: Datumsanzeige mit Wochentag und Monat
		http://blog.marcinex.net/24-09-2006/php-datumsanzeige-mit-wochentag-und-monat.html
		http://blog.marcinex.net/24-09-2006/php-datumsanzeige-mit-wochentag-und-monat.html#comments
		Sun, 24 Sep 2006 10:52:32 +0000
		marcinex
		
	Scripte
	PHP
		http://blog.marcinex.net/24-09-2006/php-datumsanzeige-mit-wochentag-und-monat.html
		
			Ich habe eine PHP-Funktion geschreiben, die ein “YYYY-MM-DD” Datum in verschiedene Datumsformate umwandelt. Dabei ist es auch möglich sich Wochentag und Monat ausgeschrieben ausgeben zu lassen:




PHP-code:


function datumformat($datum, $format) {

	list($jahr,$monat,$tag) = explode("-",$datum);

	$monate = array(
	"01"=>"Januar",
	"02"=>"Februar",
	"03"=>"März",
	"04"=>"April",
	"05"=>"Mai",
	"06"=>"Juni",
	"07"=>"Juli",
	"08"=>"August",
	"09"=>"September",
	"10"=>"Oktober",
	"11"=>"November",
	"12"=>"Dezember");

	$monat01 = $monate[$monat];

	$tage = array(
	"Sunday"=>"Sonntag",
	"Monday"=>"Montag",
	"Tuesday"=>"Dienstag",
	"Wednesday"=>"Mittwoch",
	"Thursday"=>"Donnerstag",
	"Friday"=>"Freitag",
	"Saturday"=>"Samstag");

	$wochentag = date("l", mktime(0, 0, 0, $monat, $tag, $jahr));
	$wochentag = $tage[$wochentag];

	if ($format == "1") {
		return "$tag. $monat01 $jahr"; // Format: Tag. Monat Jahr
	}
	if ($format == "2") {
		return "$wochentag, $tag. $monat01 $jahr"; // Format: Wochentag, Tag. Monat Jahr
	}
	if ($format == "3") {
		return "$tag.$monat.$jahr"; // Format: TT.MM.JJJJ
	}
}


Man ruft die Funkion mit “< ?PHP echo datumformat($datum, $format); ?>” ab.  Das Datum  muss  im Format “YYYY-MM-DD” vorliegen und als zweites wählt man das Format aus (1;2;3).


Das Script ist noch ausbau- und anpassungsfähig. Es lassen sich auch leicht andere Formatierungen zusammenstellen.


]]>
			http://blog.marcinex.net/24-09-2006/php-datumsanzeige-mit-wochentag-und-monat.html/feed/
		
		
		CSS: Externe Links automatisch markieren
		http://blog.marcinex.net/24-09-2006/css-externe-links-automatisch-markieren.html
		http://blog.marcinex.net/24-09-2006/css-externe-links-automatisch-markieren.html#comments
		Sun, 24 Sep 2006 10:37:32 +0000
		marcinex
		
	CSS
		http://blog.marcinex.net/24-09-2006/css-externe-links-automatisch-markieren.html
		
			Durch eine kleine Abfrage in CSS ist es möglich Externe Links automatisch mit einem Extern-Symbol zu markieren. Dazu liest CSS den “href” des Links aus und prüft, ob ein “http:” darin enthalten ist. Ist das der Fall, wird der Style angewendet:




CSS-code:


a[href^="http:"] {
	background: url("ext_link.gif") top right no-repeat;
	padding-right: 8px;
}


So muss man nicht mehr alle Links von Hand markieren und spart dadurch Zeit und Aufwand!


]]>
			http://blog.marcinex.net/24-09-2006/css-externe-links-automatisch-markieren.html/feed/