Div点击图片/幻灯片到JQuery的新div可能吗？

我正在寻找一些方法来点击一个DIV的图像或链接，它会滑向另一个DIV不改变，以高度......所以像下面Div点击图片/幻灯片到JQuery的新div可能吗？

<div id="div1"> 
<img src="image.jpg" onclick="slide_to_other_div" /> 
</div> 

<div id="div2" style="display:none"> 
<p>Another Div Here</p> 
</div>

但我不想手风琴的效果......我想在不影响身高的情况下滑向Div2？

进一步解释......

假设你有一个表>

<table> 
<tr> 
    <td id="div1"><a href="#div2">Slide to Div2 Direction --> </a></td> 
    <td> id="div2" style="display:none">This is Div 2</td> 
</tr> 
</table>

所以，Div1构成滚动侧身Div2的，当我点击链接到Div2的

来源

2012-01-05 Satch3000

请提出您的问题更具体。 “不影响身高”是什么意思？什么的高度？ 'div's？我看到'div2'是隐藏的;图像移动后应该隐藏“div1”吗？ “div”在视觉上会发生什么？ – PPvG 2012-01-05 15:17:12

更新的问题...希望这有助于 – Satch3000 2012-01-05 15:40:15

不是。我会建议像[slifty的回答]（http://stackoverflow.com/a/8744864/990877），但你的问题仍然太模糊。抱歉。 – PPvG 2012-01-05 15:49:38

我不是完全是确定我知道你想要发生什么，但是这里有一系列可能实现你的目标的步骤？

计算当前的图像高度并明确地设置它，使其不会改变。
计算当前的绝对图像位置
计算绝对DIV2位置
Detatch从DIV1图像，设置它的风格与前面计算的绝对位置的位置是绝对的，并将其连接到身体
有生的位置的顶部和left属性，因此“滑动”到新的位置
Detatch从体图像，取出绝对定位值，将其附加到DIV2，并显示DIV2

这听起来像你在找什么？每个步骤都可以通过jquery完成。

编辑：现在，我觉得我更了解你，你可能找一个水平手风琴。你可以从头开始编写代码，但我会建议寻找现有的解决方案来指导你（或简单地使用）。 Here就是一个例子。谷歌的“横向手风琴家”会发现更多，如果这不符合你的想象。

来源

2012-01-05 15:18:35 slifty

对不起，我认为谈论一个图像已经把每个人都关闭了我需要的东西。 Div 1有一个链接，Div 2是一个隐藏的div ...当我点击Div 1链接时，它会执行一个“水平”滚动到Div B.希望这会有所帮助。 – Satch3000 2012-01-05 15:55:17

啊，所以你正在寻找一个水平的手风琴（即像这样的东西：http://nicolahibbert.com/demo/liteAccordion/）？ – slifty 2012-01-05 16:05:34

几乎但不完全。我需要一个简单的什么有Div 1的链接，并链接到Div 2，其中Div 2将取代100％的Div 1空间。 – Satch3000 2012-01-05 16:17:42

额外的HTML：

<a name="myAnchor"></a>

Jquery：

$('#div1 img').click(function(){ 
window.location = "/currentpath_or_link#myAnchor"; 
});

它不会给你一个不错的动画，但它会让你到那里。如果你想要一个不错的动画，你需要功能scrollTo() ，但我从来没有用过。

来源

2012-01-05 15:17:35

更新说明 – Satch3000 2012-01-05 15:40:33

Div点击图片/幻灯片到JQuery的新div可能吗？

回答

相关问题