Archiv für die Kategorie ‘CSS’

MAC: Programmieren mit dem Apple Mac – korrekte Einstellung der Kodierung / Kollation

Mittwoch, 10. Oktober 2012

Wer mit dem Mac programmiert wird oft vor das Problem gestellt dass Umlaute usw. falsch ausgegeben werden. Wie codiere ich also Dateien richtig um sie korrekt auszugeben?

Beim Editor (Empfehlung: TextWrangler) sollte man die Einstellung „Western (ISO Latin 1)“ (WICHTIG: nicht zu verwechseln mit „Western Windows Latin 1“!!!) wählen. Für korrekte Zeilenumbrüche sollte „Unix (LF)“ ausgewählt werden.

In der Datenbank und generell am Server muss man die Kollation auf „utf8_general_ci“ stellen.

Mit diesen Einstellungen sollte alles einwandfrei funktionieren.

Mousoverbuttons: Grafik bzw. Bilder für Menülinks wechseln beim Hovern mit der Mouse

Sonntag, 12. Februar 2012

Folgender Code zeig wie man mittels Mouseover, sprich beim Hovern mit der Mouse über einen Imagelink ein anderes Bild anzeigen kann:

<a href="somelink.html" onmouseover="img1.src='link1_hover.gif';"
onmouseout="img1.src='link1.gif'"><img src="link1.gif"
border="0" name="img1"></a>
 
<a href="someotherlink.html" onmouseover="img2.src='link2_hover.gif';"
onmouseout="img2.src='link2.gif'"><img src="link2.gif"
border="0" name="img2"></a>

Div Positionierung – Ein Div über, bzw. vor einem anderen anzeigen lassen

Montag, 02. Mai 2011

Wenn man beispielsweise ein DIV mit einem Bild hat und dann ein weiteres kleines Bild darüberlegen will, das DIV im Vordergrund jedoch am Elternelement ausrichten will, so funktioniert das ganz einfach mit z-index und position: relative, bzw. absolute.

<div style="position: relative;"><img src="PFAD_VOM_BILD_DES_ELTERNELEMENTES.jpg" alt="" />
  <div style="position: absolute; top: 0px;"><img src="PFAD_DES_KLEINEN_BILDES_IM_VORDERGRUND.jpg" alt="" /></div>
</div>

Und fertig ist die ganze Hexerei. Hier wird das kleine Bild im Vordergrund rechts oben ohne Abstand vom Rand des grossen Bildes angezeigt.