Underscore.js

Underscore provides 45-odd functions that support both the usual functional suspects: map, select, invoke — as well as more specialized helpers: function binding, javascript templating, deep equality testing, and so on. It delegates to built-in functions, if present, so JavaScript 1.6 compliant browsers will use the native implementations of forEach, map, filter, every, some and indexOf.

for more details : http://documentcloud.github.com/underscore/

Des espaces qui s'ajoutent sous les images

On rencontre souvent ce problème, des espaces de petits pixels qui s'ajoute sous les images, et même si on leur définit les dimensions ( height ).
Pour éviter ce genre de comportement qui peut parfois gêner le contenu de votre page :
- un display :bloc pr l'image

#img { display : block }

ou
- un vertical-align : bottom

#img { display : bottom }

Problème de float

Parmi les problèmes qu'on rencontre toujours en flottant les div, c'est que le bloc conteneur ne prend pas en compte les div flottant 'fils'.

juste à préciser , on rencontre ce problème sur les naviguateurs conformes aux standards , ce qui n'est pas le cas sur le Fameux naviguateur IE(celui qui joue toujours le méchant 'naviguateur':D )

Pour voir le problème , on va prendre un petit exemple :
----------------------------------------------------------------------------------

Notre style :

#conteneur{
border:1px solid red;
width:500px;
padding:10px;
margin-bottom:20px;
}

#conteneur .div1{
float:left;
background-color:green;
width:230px;
margin-right:10px;
}

#conteneu .div2{
float:left;
width:230px;
background-color:yellow;
}

NB : le code html n'est pas autorisé , alors vous essayé de créer la page

Alors vous allez remarqué que le conteneur ne prend pas en compte les deux div , et les blocs en dessous monte en haut ..
Alors pour résoudre ce problème , on a plusieurs choix :

La propriété "clear" ( qui va nous sauver de cette problèmatique de float ) permet de gérer le contenu autour des éléments flottants et peut "pousser" un conteneur pour intégrer les éléments en float, et on procèdera comme suit :

Notre style:

#conteneur{
border:1px solid red;
width:500px;
padding:10px;
margin-bottom:20px;
}

.div1{
float:left;
background-color:green;
width:230px;
margin-right:10px;
}
.div2{
float:left;
width:230px;
background-color:yellow;
}

.spacer{
clear:both;
}


Sur la page que vous avez déjà créer : on va ajouter un "div" ou un "br" ou un "hr" et on lui attribuera la classe "spacer" après le "div2".

la class spacer a comme prop : clear :).

Sinon on peut aussi faire appel à overflow, qu'on va mettre au div conteneur , et on procèdera comme suit :

Notre style :

#conteneur{
border:1px solid red;
width:500px;
padding:10px;
margin-bottom:20px;

overflow:hidden;

}

.div1{
float:left;
background-color:green;
width:230px;
margin-right:10px;
}
.div2{
float:left;
width:230px;
background-color:yellow;
}

Juste a noter que sur IE , nécessite parfois à définir la largeur du bloc qui aura la propriété overflow :)

CSS pour l'impression

Paged media (e.g., paper, transparencies, pages that are displayed on computer screens, etc.) differ from continuous media in that the content of the document is split into one or more discrete pages. To handle pages, CSS 2.1 describes how page margins are set on page boxes, and how page breaks are declared.

plus de détails sur : http://www.w3.org/TR/CSS21/page.html

La librairie PHP JpGraph

La librairie PHP JpGraph est une librairie graphique orientée objet de haut niveau et très riche permettant de réaliser dynamiquement des graphiques depuis PHP. Elle est installée, sur le serveur Web ENAC-IT1, conjointement avec la librairie graphique GD (supportant la manipulation d'images JPEG et PNG depuis PHP) ....

Pour plus d'info , visitez le site : http://www.aditus.nu/jpgraph/

Effets secondaires du filtre AlphaImageLoader en cas de positionnement absolu

Le filtre AlphaImageLoader a plusieurs effets secondaires. Le principal est que le texte à l'intérieur d'un élément sur lequel on a appliqué le filtre n'est plus sélectionnable, les liens plus cliquables, etc. Cela se corrige généralement en passant le texte ou les liens en positionnement relatif (mais cela peut être un peu plus subtil et il y a des cas particuliers assez retors)...

http://covertprestige.info/test/47-alphaimageloader-absolute.html

Using Images as Labels in Internet Explorer

What the label does is create an association between its contents and a control on the page. In most browsers, clicking on text or an image within the label will give focus to the area. In the case of a radio button, it will select it and in the case of a checkbox, it'll alternate between the two states (checked and unchecked).

Internet Explorer, however, has a bug where clicking on an image inside a label tag does nothing. (Actually, I should say nothing useful because with radio buttons and checkboxes it looks like it tries to select the control but never does.)

What I've done is put together a quick bit of unobtrusive JavaScript to "fix" the problem. Albeit, only for people with JavaScript turned on.

http://snook.ca/archives/javascript/using_images_as/