jQuery - améliore/réduit mon code déroulant de style ipod! - défi?

Question

en gardant l'inspiration de cette

http://www.filamentgroup.com/examples/menus/ipod.php

i ont maked ma propre cause de rien j'ai besoin de cette solution déroulante Smarty pour un client, mais plus léger & efficace!

donc avec une bonne tasse de café dans ma main j'ai maked ce

• DEMO:http://so.devilmaycode.it/jquery-improve-reduce-my-ipod-style-dropdown-code-challenge/

puisque c'est une preuve concept o, whould être gentil à savoir, avant de le transférer dans un plugin, ce que vous en pensez!

est bon, mauvais ou peut être amélioré ou réduit en taille !?

Je suis heureux de partager ce code avec vous et serait bien si vous voulez me donner des commentaires! ;-)

PS: fonctionne parfaitement dans IE6 +, Firefox, Chrome, Opera et de support de cours le Roller Thème jQuery et ont zéro étapes de configuration!

merci les gars!

Answer 1

Ça a l'air bien. Une chose que je dirais que vous devriez essayer de stocker des objets jQuery dans une variable si vous allez les utiliser plus d'une fois, et essayez de profiter du chaînage.

Comme cela au début du code:

var $ipod_box = $('.ipod_select_box');  // Stored reference 

$ipod_box.addClass('ui-widget-content ui-corner-all')  // Used chaining 
     .find('ul:eq(0)').attr('class' , 'ipod_main_ul'); 

$ipod_box.find('li a:eq(0)').attr('class'... 

Et ceci:

var $ipod_box_a = $ipod_box.find('ul li a');  // Stored reference 

$ipod_box_a.each(function(e) { 
    $th = $(this);      // Stored reference 
    if ($th.next().is('ul')) { 
     $th.next().attr('class','ipod_sub').hide(); 
... 

$ipod_box_a.hover(... 

En outre, dans quelques endroits, vous utilisez ensemble prevAll() et prevNext(), quand vous pouvez simplement utiliser siblings().

Comme ici:

$ipod_li.siblings().hide(); // siblings() instead of prevAll() nextAll() 

Aussi, lorsque vous survolez un élément de menu, il y a un petit jogging vers le bas qui se passe. Je suppose que c'est parce que l'objet plané obtient une bordure où il n'y en avait pas auparavant.

Vous souhaiterez peut-être redimensionner tous les éléments de menu afin qu'ils puissent tous avoir une bordure correspondant à la couleur d'arrière-plan. Ensuite, lorsque vous passez la souris sur un, vous changez simplement sa couleur.

Cela semble bien dans l'ensemble.