La diapositive d'interface utilisateur de Jquery ne fonctionne pas sur certains éléments

Question

Ici, j'ai une démo de base de Jquery slideToggle travaillant sur un élément, mais jquery Slide UI pas.

http://jsbin.com/obuha/edit

S'il vous plaît regarder la démo, le bouton JQuery UI fonctionne pour le texte ci-dessus, mais pas pour le logo Google. Le bouton slideToggle fonctionne pour le logo.

Comment puis-je faire fonctionner la diapositive de l'interface utilisateur Jquery avec le logo?

Merci.

Et j'espère que cela peut être fait sans changer le DOM.

Answer 1

J'ai vérifié votre code et je pense que le problème est parce que l'image est ajoutée un arrière-plan de style en ligne de l'envergure. Cela semble être déconner avec effet de diapositive. Toutefois, cela fonctionne très bien si vous appliquez l'effet sur le conteneur DIV à la place. Voir ici: http://jsbin.com/aluwu

Donc, cela fonctionne très bien:

$('#container').effect("slide", {}, 1000); 

Au lieu de cela:

$('span.image').effect("slide", {}, 1000);