Suite à l’article vu sur ajaxian, je tenez à vous en faire profiter si vous ne suivez pas ebcore ce blog

Il s’agit en fait d’un js qui, utilisé sans aucune dépendance, permet d’insérer des indicateurs de chargemenr n’importe où et n’importe quand dans votre site !

Jettez un oeil à la démo et voyez par vous même en changeant les paramètres, c’est vraiment génial !!

Vous pouvez l’associer à jQuery par exemple en utilisant ce code :

1. var ctrl = getBusyOverlay($(‘#box’));

2. setTimeout(
       function() {
           ctrl.remove();
       }, 2000);

Pour télécharger la librairie et peut-être en faire un plugin jQuery , cliquez-ici : busy.js

Download It !

Je vous présente ici module permettant de mettre en place un moteur de recherche style "FaceBook" avec autocomplétion.

Ce module s’appuie sur les librairies de jQuery, ainsi que sur le module d’autocomplétion ‘Bsn Autosuggest".

Côté customisation, on peut s’appuyer sur des plugins de recherche qui permettent de catégoriser les résultats de recherche.

=> Exemple : http://web2ajax.fr/examples/facebook_searchengine/

Have Fun !

Tout est bon pour gagner de précieuses minutes pour un webdesigner, et ce plugin est vraiment très pratique.

Comment on fait pour créer une boite avec des coins arrondis en temps normal ? On prend photoshop, on dessine un rectangle avec coins arrondis, on découpe l’image en 8, on la stocke sur le serveur et on met tout ça dans un tableau 3×3 ou dans des div imbriqués…

Vous m’avez compris, celà prend du temps et peut devenir fastidieux si on veut changer la couleur, faire des boites de style différents…

Et bien c’est terminé tout ça ! Une ligne de commande suffit à donner le plus bel effet à un simple rectangle de couleur. Pour plus d’informations, lisez ce post : http://blue-anvil.com/archives/anti-aliased-rounded-corners-with-jquery

Alors attention, avis aux webmasters : ce post est pour vous !!

Voici un site qui regroupe une palanquée de générateurs Web2.0 pour donner un bon coup de contraste à votre site : http://techmagazine.ws/online-generators/

On y trouve de tout : générateur de badges, de boutons, de loading, de stripes (ces fameuses bandes obliques),  de logos, de textes multicolores…

A utiliser sans modération !

Vous souhaitez mettre en place un menu design horizontal ou vertical sur votre site, votre blog et ce en moins de 10 minutes ?

Un Générateur de menu vient de faire son apparition sous le nom de http://cssmenumaker.com/

On met le nombre de boutons que l’on veut afficher, le texte, les URL et tout ça est servi dans un zip prêt à utiliser.

Je commence à lire pas mal de choses sur l’art et la manière de contraster et disposer les éléments d’une page web pour que l’oeil du visiteur suive un chemin précis que j’ai fixé.

C’est pas facile, mais quoiqu’il en soit, ça améliore terriblement le rendu visuel et le visiteur ne se dit pas : "Mais c’est quoi ce site où je comprends rien ??"(D’ailleurs, vous me ferez penser à changer le design du site qui est à mon gout horrible...).

Bon en tout cas, voici un excellent article linké par Ajaxian (http://ajaxian.com/archives/primary-secondary-actions-in-web-forms) , et une étude métrique faite sur 23 utilisateurs que l’on a instrumenté pour voir où se poser leur regard.

=> Très interessant et instructif, à consulter donc d’urgence : http://www.lukew.com/resources/articles/PSactions.asp

Un autre article m’avait également appris beaucoup de choses sur le contraste, et la hauteur des éléments à utiliser pour mettre en évidence le contenu sur un site => c’est rempli de bonnes vérités et de bons conseils.

=> A lire également d’urgence pour rattraper votre retards : http://www.pompage.net/pompe/contraste-et-sens/

Allé, je vous laisse pour aujourd’hui ! Ciao.

Edit de 10h40 : Et merci à DezinerFolio pour ce thème ! (http://www.dezinerfolio.com/2007/09/04/simpress-free-theme-download/)

Voici un effet de fondu de transparence appliquable sur un élément DIv/A/TD/Button… du plus bel effet. Pour plus d’informations, éditez la source de la page ci-dessous

Tout développeur web vous le dira : faut vraiment sortir les rames pour que votre site ait exactement la même tête sous IE6, IE7, FireFox, Opera, Safari… Et je bloquais depuis un bon moment sur un problème de menu déroulant central qui passait en dessous des images du site : ça fait pas terrible. Tout était nickel sous FireFox (logique ) mais pas du tout sur IE (normal). La réponse sur les forums était ‘z-index’, ‘z-index’ et’z-index’… Mais même avec un z-index à 1000000, le div passait toujours en dessous… Il faut donc savoir que d’une part, un z-index est appliqué seulement sur des Div en position absolute, relative ou fixed. Mais ce qu’il faut surtout pas louper comme info, et ça j’ai mis du temps à le découvrir, c’est qu’il faut obligatorement mettre le style ‘position:relative’, avant le ‘z-index’ car sinon il n’est pas pris en compte… Ah ! Merci Billou, on s’embeterait sans IE !

En parlant de IE et de ses grandes capacités à respecter les normes CSS 2.0 (séquence ironie), voici un truc et astuce pour ceux qui se demandent : ‘Mais pourquoi sous IE j’ai un espace qui me flingue ma mise en page au niveau du formulaire ?’ Pas de panique ! Il suffit juste de rajouter ces propriétés de style : margin:0px; padding:0px; display:inline; Merci qui ?

Sans FrameWork AJAX : FishEye Menu Avec jQuery : iconDock jQuery Plugin Avec prototype et scriptaculous : WhaleSalad