Websourcing.fr » Actualités, Web, Logiciels et Fun

[Webdesign] iconDock, un autre script JQuery pour créer des menus « Fish-Eye »

Tags: Dock, Javascript, JQuery, MacOs, Webdesign
Posté dans Billets par Lionel Roux le 29 juin 2009

Au début du mois je vous présentais jqDock, un superbe script qui permet de créer des menus « Fish-Eye » à la manière de ce que propose le dock de Mac OS X.

Ce genre de dock rend les menus à la fois discrets et percutants.

iConDock est un concurrent direct, qui permet de créer exactement la même chose.

Le principe est globalement le même, on crée une structure de menu que l’on instrumente via ce script iConDock et jQuery.

<div id="Bar">
	<a href="http://blog.websourcing.fr/1" name="Alertes_name" title="Google alertes">
		<img src="img/alerts_35.gif" alt="Campana_alt" border="0" />
	</a>
	<a href="http://blog.websourcing.fr/2" name="script_name" title="Google script">
		<img src="img/desktop_35.gif" alt="Escriptori_alt" border="0" />
	</a>
	<a href="http://blog.websourcing.fr/3" name="Compres_name" title="Google compres">
		<img src="img/froogle_35.gif" alt="Froogle_alt" border="0" />
	</a>
	<a href="http://blog.websourcing.fr/4" name="GMail_name" title="Google mail">
		<img src="img/gmail_35.gif" alt="Gmail_alt" border="0" />
	</a>
	<a href="http://blog.websourcing.fr/5" name="Groups_name" title="Google groups">
		<img src="img/groups_35.gif" alt="Grups_alt" border="0" />
	</a>
	<a href="http://blog.websourcing.fr/6" name="Linux_name" title="Linux">
		<img src="img/special_35.gif" alt="Especial_alt" border="0" />
	</a>
</div>

Là encore, la configuration est simple:

<script type="text/javascript">
	var confObject = {
		iconMinSide : 35,
		iconMaxSide : 70,
		distAttDock : 100,
		coefAttDock : 2,
		veloOutDock : 500,
		valign: 'bottom'
	}
	jQuery(function() {
 		jQuery("#Bar").addDockEffect(confObject);
	});
</script>

Le script a été testé avec différents navigateurs et différents OS:

PC & Windows XP
• Mozilla Firefox 2.0
• Internet Explorer 6.0
• Internet Explorer 7.0

Apple Mac & Mac OS X
• Mozilla Firefox 1.5
• Safari 2.0

Personnellement je préfère jqDock. Son système de configuration permet de réaliser plus de choses (comme des menus verticaux). Néanmoins iconDock ne manque pas d’atouts.

Voir le script en action Рd̩monstration

Téléchargez le script et en savoir plus