Html5 Boilerplate Kritik mit unerwartetem Lerneffekt

von

Jens O. Meiert kritisiert auf Google+ die ausufernden Conditional Stylesheets mit IE-Klassen im Html5 Boilerplate von Paul Irish u.a.:

So people use stuff like

<!–[if lt IE 7]> <html class=“no-js lt-ie9 lt-ie8 lt-ie7″> <![endif]–> <!–[if IE 7]> <html class=“no-js lt-ie9 lt-ie8″> <![endif]–> <!–[if IE 8]> <html class=“no-js lt-ie9″> <![endif]–> <!–[if gt IE 8]><!–> <!–<![endif]–>

and nobody asks what’s wrong with that picture?

I keep on seeing this, and it’s ridiculous. What you really want to write is this instead:

Seriously: The start tag is optional (as is its end tag), and the rest has no business to do in an HTML document.

Zuerst fühlte ich mich selbst etwas getroffen (da ich auch diesen Code schon verwendet habe – und noch nichtmal die entsprechenden IE-Klassen deklariert aus  Mangel an Notwendigkeit). Dann habe ich mich auf den Wortfetzen „the start tag is optional“ geworfen, und siehe da – wieder was dazugelernt!

Elementen per jQuery und Math.max gleiche Höhe zuweisen

von

Oft steht man vor der Schwierigkeit, daß mehrere gefloatete Boxen mit dynamischem Inhalt gefüllt werden und daher keine feste Höhe bekannt ist. Wenn nun die Boxen trotzdem alle schön gleichgroß sein sollen, hilft folgendes Stückchen jQuery:

/* set equal height on boxes  */
/* http://stackoverflow.com/questions/5052673/jquery-min-max-property-from-array-of-elements  */
Array.max = function( array ){
    return Math.max.apply( Math, array );
};
var heights = jQuery(".box").map(function() {
    return jQuery(this).height();
}).get();
jQuery(".box").css("height", Array.max(heights));

IE 10 reviewed

von

Das Review habe ich garnicht komplett gelesen, mir reichte für den Lacher des Tages ein Absatz zum Thema Installation:

The most exciting news is that Microsoft has finally implemented automated updates. It’s on by default so let’s hope large organizations keep it that way when they get around to deploying Windows 8 in 2026.

Danke für den Schmunzler an Craig Buckler.

WordPress: Darstellung des Artikelbildes der Eltern-Seite auf der Kind-Seite

von

Wenn man das Artikelbild der Parent Page für alle Child Pages nutzen will, so sie kein eigenes Artikelbild haben, kann man sich dieser Zeilen bedienen. Quelle: codex.wordpress.org.

global $post;

if ( is_page() ) { 

  /* Get an array of Ancestors and Parents if they exist */
  $parents = get_post_ancestors( $post->ID );

  /* Get the top Level page->ID count base 1, array base 0 so -1 */ 
  $id = ($parents) ? $parents[count($parents)-1]: $post->ID;

  echo get_the_post_thumbnail( $id, 'full' );

}

CSS Sprite Workflow mit Compass und Sass

von

Schon vor einiger Zeit habe ich angefangen, Compass mit Sass zu benutzen. Die Vorteile dieses  CSS-Preprozessors wurden ja schon ausgiebig gefeiert, Neues zum Thema findet sich zb. bei The Sass Way. Was mir bisher völlig durch die Lappen ging, ist das Superfeature der automatischen Sprite Erstellung. Hier darauf gestoßen, dann gleich selbst ausprobiert – total simpel! Man braucht nur (eine Compass/Sass Installation vorausgesetzt) einen Ordner mit Png Icons zu befüttern und diesen in der SCSS Datei folgendermaßen als Cprite Ordner referenzieren:

@import "my-icons/*.png";
@include all-my-icons-sprites;

Schon generiert Compass ein Sprite mit allen Bildern im Ordner. Pro Bild wird eine Ccc-Klasse zur Verfügung gestellt, die so heißt wie das Bild. Das Thema „CSS Sprite Workflow“ hat sich damit dann quasi bis auf null reduziert.