Leeräume zwischen vertikalen Listen entfernen

Bei der Verwendung von Listen (ul) kann es bei einer vertikalen Anordnung via display: inline-block; zu Leerräumen zwischen den Listenelementen kommen. Dieses Verhalten ist insbesondere in Kombination mit Rahmen oder Hintergrundfarben störend.

Die Leerräume entstehen durch unsichtbare Leerzeichen zwischen den Listenelementen. Sie lassen sich umgehen, indem die Schriftgröße des übergeordneten Elements auf “0″ gesetzt wird. Anschließend muss den einzelnen Listenelemente wieder die eigentliche Schriftgröße zugeordnet werden.

#menu ul {
    font-size: 0;
}
#menu ul li {
    font-size: 14px;
}

jQuery .load() ohne Container

Mit jQuery-Funktion .load() ist es möglich, Inhalte eines Dokuments in ein vorhandenes Element zu laden. Zudem ist es möglich nur ein spezielles Element einer Webseite zu laden:

$('#result').load('dir/file.html #content');

Allerdings wird hierbei der Inhalt des Elements #content von einem gleichnamigen Container eingeschlossen. Das Laden des Inhalts ohne Container ist möglich, indem man explizit alle Kind-Elemente lädt:

$('#result').load('dir/file.html #content > *');

Überprüfen, ob mod_rewrite aktiviert ist

mod_rewrite ist die Rewrite-Engine des Apache Webservers und wird in vielen modernen Webanwendungen eingesetzt. Jedoch gibt es bisher keine zuverlässige Möglichkeit, um die Unterstützung von mod_rewrite via PHP zu ermitteln. Im Folgenden werde ich eine Möglichkeit erläutern, die Unterstützung von mod_rewrite trotzdem zuverlässig zu ermitteln.

Über die .htaccess-Datei ist es möglich Regeln für die Verwendung von mod_rewrite aufzustellen, allerdings könnte diese deaktiviert sein, weswegen das Workaround grundsätzlich auf die .htaccess-Datei abzielt.

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteRule ^/index.php     /index.php?mod_rewrite=1 [QSA]
</IfModule>

Das oben-stehende Snippet überprüft, ob mod_rewrite aktiviert ist und hängt einen unsichtbaren Parameter an die URL an. Via PHP ist es nun möglich diesen Parameter zu überprüfen. Natürlich kann mod_rewrite durch einen anderen Parameter-Namen ersetzt werden, damit er nicht bewusst (oder unbewusst) manipuliert werden kann. Bsp.:

if ($_GET['mod_rewrite'] == '1') {
    //Funktionen
}

jQuery Mobile: Flackernde/ blickende Übergänge

In jQuery Mobile (1.2) kann es bei der Verwendung von

<meta name="viewport" content="width=[...]user-scalable=no[...]">

zu einem Folgefehler kommen, der sich durch flackernde bzw. blickende Buttons bei den Übergängen erkenntlich macht. Das Problem konnte ich unter Android 2.3.* feststellen, bei dem Versuch eine gefixte Navigation (position: fixed;) im Fußbereich zu platzieren.
Als Workaround für die flackernden/ blickenden Übergänge scheint es leider keine besser Lösung zu geben, als die Animationen komplett zu deaktivieren:

$('#page_id').live('pagecreate', function () {
    $.mobile.defaultDialogTransition = "none";
    $.mobile.defaultPageTransition = "none";
});

JQuery Mobile: Cannot call methods on button prior to initialization

Bei der Erstellung von Buttons via Javascript in JQuery Mobile stößt man u.U. auf folgende Fehlermeldung:

cannot call methods on button prior to initialization

In der Doku von JQuery Mobile gibt es keinerlei Hinweise zur Lösung des Problems. Allerdings muss das erstellte Element nur als Button “registriert” werden. Das Problem verschwindet unter Verwendung folgendes Snippets:

$('#container').append('html_code des Buttons'); //Erstellung des Buttons
$('.neuer_button').button(); //Registrierung des Buttons
$('.neuer_button').button('refresh'); //Aktualisieren/ Rendern des Buttons

Android-Debugging: Unable to open sync connection!

Beim Debuggen seiner Android-Apps per USB an einem Smartphone, kann es zu folgender Fehlermeldung kommen:

 java.io.IOException: Unable to open sync connection!

Dieses Problem kann behoben werden, indem man das USB-Debugging auf dem Smartphone deaktiviert und anschließend wieder aktiviert.

jQuery: Error-Handling von cross-domain Ajax-Requests

Bei Einsatz von Ajax zum dynamischen Nachladen von Inhalten (bspw. in einer HTML5-App), gibt es Besonderheiten zu beachten, wenn man diese domainübergreifend (cross-domain) durchführt: Setzt man keinen “timeout“-Parameter, ist ein Abfangen von Fehlern der Anfrage nicht möglich (im Erfolgsfall werden aber trotzdem die entsprechenden Events abgefeuert).

Um nun die Fehler abzufangen, hilft der folgende Javascript-Code weiter:

var req = $.ajax({url:'http://example.com&callback=?',
	dataType:'json',
	timeout:10000
});
req.done(function () {
	//Aktionen bei erfolgreicher Anfrage
});
req.fail(function () {
	//Aktionen bei fehlgeschlagener Abfrage
});