1

我不确定这个问题是否可以，它有点灰色地带。

我想创建一个类似于在这个示例配置文件中看到的效果

现在我需要一些帮助，我知道所有的 div 都在一个具有固定宽度的容器中，但是当你将鼠标悬停在它们上面时，它们会从主容器 div 中长出来。我注意到它们是相对位置，这解释了如何保持文档的流动，并且 div 可以脱离容器..而它们向左浮动。

我将使用 .animate 来增长 div，并使用 .fadeTo 淡出其他 div ($('.box.).not(this).. 等。

我将在今天晚些时候提供一个代码示例。

我想知道是否有人知道其他 div 是如何被推到一边的，或者是这样做的好方法

4

2 回答 2

3

使用 CSS 和 JavaScript。在其中一个 div 元素悬停时，根据其他 div 元素相对于鼠标悬停 div 元素的位置，其他元素被赋予一个类 slide-down/slide-up/slide-right/slide-left。例如，当给定类向下滑动时：

.slide-down .animate {
top: 10px;
}

为了实现淡入淡出，正在使用这个 css：

.slide-down .animate, .slide-up .animate, .slide-right .animate, .slide-left .animate {
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
opacity: 0.4;
}

我找不到使类更改的 javascript，但使用 javascript 或 jQuery 重新创建应该非常简单。

于 2012-10-17T13:29:47.753 回答
1

http://jsfiddle.net/d8BuH/

非常简单的例子。我使用边距和浮动而不是基于类的方法。这个你不会有太多的控制，但代码要简单得多。因此，如果您正在寻找一个很酷的简单效果，这可能对您有用。

于 2012-10-17T13:48:07.743 回答