HTML | Blog der TYPO3-Agentur mobasoft aus Dresden

Jul 09

Eindeutige ID für Body-Tag

Dienstag, 09.07.2013 19:03

Manchmal möchte man Elemente, die auf verschiedenen Seiten wiederkehren, für spezielle Seiten per CSS formatieren. Lösungsansätze gibt es hierfür verschiedene. Inhalts-Elemente besitzen ja schon eigene IDs (c123), über die man das Element ansprechen kann.

Dennoch ist es manchmal von Vorteil, der BODY-Tag hätte eine eigene ID (oder Klasse), über die man alle Inhalte innerhalb ansprechen kann.

Dazu ist folgendes TypoScript (Setup) notwendig:

page.bodyTag >
page.bodyTagCObject = TEXT
page.bodyTagCObject.field = uid
page.bodyTagCObject.wrap = <body id="page-|">

Wenn wir jetzt noch eine Klasse hätten, die auch noch die ID der übergeordneten Seite ausgäbe, so wäre es natürlich noch besser.

page.bodyTag >
page.bodyTagCObject = TEXT
page.bodyTagCObject.field = uid
page.bodyTagCObject.wrap = <body id="page-|" class="parent-{field:pid}">

Thema: TYPO3, TypoScript | Kommentare (0) | Autor: mobasoft

Mrz 28

Valider Facebook-Like-Button

Mittwoch, 28.03.2012 05:52

Da es kein HTML-Tag "<fb:like>" gibt, schlägt der Validator Alarm. Abhilfe schafft hierbei mal wieder ein Schnipsel JavaScript, indem wir einfach das Element im DOM erzeugen:
<div id="fb-root"></div> <script type="text/javascript" src="http://connect.facebook.net/de_DE/all.js#xfbml=1"></script><script type="text/javascript"> // <![CDATA[ var c = document.getElementById('fb-root'); var e = document.createElement('fb:like'); e.setAttribute('action', 'like'); e.setAttribute('width', '100'); e.setAttribute('layout', 'button_count'); e.setAttribute('send', 'false'); e.setAttribute('href', ''); e.setAttribute('show_faces', 'false'); e.setAttribute('font', ''); c.appendChild(e); // ]]> </script>

Das war´s schon. Nach einem erneuten Validitäts-Check sollte nun (zumindest an dieser Stelle des Quellcodes) kein Fehler mehr auftauchen.

Thema: JavaScript, Soziale Netzwerke | Kommentare (0) | Autor: mobasoft

Okt 13

IE-Bug: Weißer Hintergrund bei Hover

Donnerstag, 13.10.2011 12:54

Nach langer Suche aufgedeckt: Bei :hover ändert sich im IE (7) die Hintergrundfarbe nicht auf Weiß (#FFFFFF).

Beispiel:

HTML:

<div><a href=“#“>Mouseover</a></div>

CSS:

DIV {background-color:#000000;}
A {width:100%;display:block;border:1px solid #000000;color:#DDDDDD;}
A:HOVER {background-color:#FFFFFF;color:#000000;}

Thema: Allgemein | Kommentare (0) | Autor: mobasoft