Trinidev » Astuce

Standards XHTML strict et prises de tête (cachez ces espaces que nous ne saurions voir)

Alban Jubert — Sat, 21 Nov 2009 14:13:44 +0000

Les standards ont du bon. Malgré tout, parfois, ils apportent leurs lots de petits problèmes sur lesquels on peut passer quelques heures en s’arrachant les cheveux (et il m’en reste si peu…)

Dernier exemple en date, ce sont 2 ou 3 mystérieux pixels qui apparaissent sous les balises images (img) lorsqu’on utilise le standard XHTML Strict. Pour illustrer le phénomène, prenons ce cas assez classique de montage d’image découpée en plusieurs tranches assemblées dans un tableau.

^?View Code HTML



    
        
        New Web Project

Ce qui donne comme résultat (sous Firefox) :

Les block images « poussent » leurs conteneurs (en l’occurrence la cellule de tableau) de quelques pixel en bas. Ca n’a évidement rien de très esthétique et ça n’est pas le résultat attendu.

Donc, à moins de changer la déclaration du type de document HTML, il va falloir ruser.

Pour contourner ce problème, il faudra définir l’affichage de vos images en mode « block » dans votre CSS. Vous pouvez le faire de plusieurs façons :

Systématiquement dans une déclaration CSS globale de vos balises img, l’inconvénient étant que celles-ci produiront un retour à la ligne (dans ce cas, il faudra les définir localement en mode float afin d’éviter ces retours).
En déclarant localement un style dans vos balises img de type style="display:block;".
En créant une classe spécifique que vous affecterez aux images nécessitant l’ajustement.

Cette dernière solution peut donner au final :

^?View Code HTML



    
        
        New Web Project

Et voila le rendu enfin correct :

Allez, à nous les montages de fou en XHTML Strict

Partager/Sauvegarder

Activer l’auto-complétion dans Eclipse/Aptana pour les projets CakePHP

Alban Jubert — Sat, 25 Jul 2009 13:30:36 +0000

Un article intéressant vient d’être publié sur The Bakery. Il décrit une astuce permettant de tirer parti des fonctionnalité d’auto-complétion de Eclipse/Aptana pour le développement de projets CakePHP (pour les modèles et les helpers notamment).

Ca n’est pas aussi simple qu’avec un projet Yii Framework (il n’y a rien à faire), mais ça a le mérite de fonctionner

Partager/Sauvegarder

Nouveau tutorial Yii : Astuce autour des contrôleurs

Alban Jubert — Thu, 11 Jun 2009 16:58:42 +0000

On continu le tour des astuces pour Yii Framework avec un petit tuto qui montre comment mutualiser certains comportements et paramètres entre tous les contrôleurs d’une même application.

Bonne lecture.

Partager/Sauvegarder

Nouveau tutorial Yii – Comment utiliser le « profiling » ?

Alban Jubert — Thu, 21 May 2009 10:57:12 +0000

Un petit tuto Yii qui montre comment utiliser les fonctions de « profiling » permettant d’améliorer les performances d’une application est disponible ici. Vos remarques et commentaires sont les bienvenus.

Bonne lecture

Partager/Sauvegarder

Vérifier les modifications de formulaires avec jQuery

Alban Jubert — Sun, 15 Mar 2009 13:55:06 +0000

Vous souhaitez alerter vos utilisateurs s’ils ont modifié le contenu d’un formulaire et qu’ils s’apprêtent à quitter la page par l’intermédiaire d’un lien sans avoir validé ?

Un petit javascript permet de facilement accomplir cela.

^?View Code JAVASCRIPT

jQuery(document).ready(function() {
	$(window).attr("isDirty", false);
	$(":input").bind("change", function(event) {
				if (event.target.value != event.target.defaultValue) {
					$(window).attr("isDirty", true);
				}
			});
	$(":checkbox,:radio").bind("click", function(event) {
				if (event.target.checked != event.target.defaultChecked) {
					$(window).attr("isDirty", true);
				}
			});
	$("a, button").bind("click", function(event) {
		if (window.isDirty) {
			return confirm("Etes-vous sûre de vouloir quitter cette page sans enregistrer ?");
		}
	});
}

L’astuce consiste à créer un attribut isDirty attaché à la page et à en changer l’état dès qu’une valeur de champ a été modifiée. Au chargement de la page, on attache des listeners aux champs, checkbox et boutons radio qui vont scruter leurs éventuelles modifications. Lorsque l’utilisateur clique sur un lien, on vérifie juste la valeur de cet état pour déclencher une demande de confirmation le cas échéant (qui dans le cas négatif, interrompt l’événement de changement de page).

On peut facilement adapter ce code à Prototype ou à MooTools afin de réaliser la même chose avec ses librairies.

Partager/Sauvegarder

Accéder à l’aide de Flash CS4 en local

Pascal Achard — Sun, 22 Feb 2009 17:49:23 +0000

Dans Flash CS4, l’aide n’est plus intégrée dans l’application. Quand on clique sur F1, on ouvre le navigateur et on se connecte à l’aide en ligne. C’est pas très pratique quand on n’est pas connecté. Heureusement, il y à une petite astuce qui permet d’accéder à l’aide en local.
J’ai fait une petite vidéo qui explique comment procéder.

Voilà, j’éspère que ça vous aidera…

Partager/Sauvegarder

Tester Google Maps en local : c’est possible

Alban Jubert — Tue, 10 Feb 2009 12:26:30 +0000

Les idées reçues ont la vie dure. J’ai toujours été persuadé qu’il n’était pas possible d’utiliser les API Google et Google Maps en particulier autrement que sur un serveur de production possédant un nom de domaine valide.

Et bien, ça n’est pas vrai du tout. En réalité, on peut parfaitement effectuer une demande de clé en saisissant un nom de domaine comme http://localhost/. Et ça fonctionne.

Je sais que certains d’entre vous connaissaient déjà l’astuce. Moi pas. Et sans doute reste-t-il encore quelques développeurs dans l’ignorance. Bref, comme on dit, on en apprend tous les jours

Partager/Sauvegarder