多个slideToggle div之间的过渡 [英] Transition between multiple slideToggle divs

问题描述

我的网页的基本功能是我将具有缩略图，.thnail将显示一个项目，单击时，下拉面板.dropdown将向下滑动以显示项目的图像(轮播插件)关于单击的缩略图.功能几乎已经存在，但是单击缩略图之间的过渡确实很突然.我希望面板先滑动后再向下滑动，一旦选择了另一个缩略图.

The basic functionality of my webpage is that I will have thumbnails, .thnail which will display a project, when clicked, a drop down panel, .dropdown, will slide down to show images (carousel plug in) of projects with respect to the thumbnail clicked.The functionality is almost there, but the transition between clicking the thumbnails is really abrupt. I want the panel to slideUp and then slideDown once ANOTHER thumbnail is selected.

要注意的是，我需要将.dropdown和.thnail分开，由于我在轮播中使用了复杂的插件，因此它们不能成为父/子.

The catch is that I need the .dropdown and .thnailto be separate, they cannot be a parent/child due to the fact that I am using a complex plug in for my carousel.

这是我的 JSFIDDLE

HERE IS MY JSFIDDLE

我找到了这个教程 ，但是我很难实现它，因为它基于父/子关系，而我的html基于ID关系.

I found this tutorial , but I am having trouble implementing it because it's based off parent/child relationship while my html is based off of ID relationships.

第二，有没有办法通过rel="..."而不是href="#"关联我的ID?有关系吗?

Secondly, is there a way to relate my ID's via rel="..." instead of href="#" ? Does it matter?

推荐答案

以下是要滑动的 jsfiddle 多个元素.您可能会注意到，在下拉菜单之间进行切换时，下拉菜单下方的元素会抖动".

Here's the jsfiddle to slide multiple elements. You might notice that the elements below the dropdowns would "shake" when switching between dropdown.

看看这个 jsfiddle 可以最大程度地减少这种震动.最上面的与上面的完全相同，最下面的是变化.

Take alook at this jsfiddle to minimize that shaking. The top ones are the exact same one as above, and the bottom ones are the variation.

这篇关于多个slideToggle div之间的过渡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！