Javascript Div单击图像/幻灯片以使用JQuery创建新Div？

我正在寻找一种方法，点击一个Div上的图片或链接，它将滑动到另一个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>

这里是另一个分区

但我不想要手风琴的效果。。。我想在不影响高度的情况下滑到第2部分

进一步解释

假设您有一张桌子>

<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>

id=“div2”style=“display:none”>这是div2

因此，当我单击指向Div2的链接时，Div1会横向滚动到Div2

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

它不会给你一个很好的动画，但它会带你去那里。 如果你想要一个好的动画，你需要函数

scrollTo（）

但是我从来没有这样做过。

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

计算当前图像高度并显式设置，使其不会更改

计算当前绝对图像位置

计算绝对div2位置

从div1中删除图像，将其样式设置为position absolute（绝对位置），并将其附加到主体

设置位置顶部和左侧属性的动画，使其“滑动”到新位置

从正文中删除图像，删除绝对定位值，将其附加到div2，然后显示div2

这听起来像你要找的吗？这些步骤中的每一步都可以通过jquery完成

---

---

编辑：现在我想我对你有了更多的了解，你可能正在寻找一名水平手风琴手。您可以从头开始编写代码，但我建议查看现有的解决方案来指导您（或者简单地使用）。这是一个例子。如果不符合您的喜好，请通过谷歌“水平手风琴”查找更多内容。

请将您的问题更具体一些。“不影响身高”是什么意思？什么高度？

div

s？我看到

div2

被隐藏；图像移动后是否应隐藏

div1

？

div

s在视觉上会发生什么情况？更新的问题。。。希望这不是真的。我本想提出类似的建议，但你的问题仍然太模糊了。对不起，对不起，我认为谈论一张图片会让大家对我需要的东西产生反感。有一个关于Div 1的链接，Div 2是一个隐藏的Div。。。当我点击Div 1链接时，它会“水平”滚动到Div B。希望这能有所帮助。啊，那么你正在寻找水平手风琴（例如，类似这样的东西：）？几乎但不完全如此。我需要一个简单的什么，在Div 1上有一个链接，链接到Div 2，其中Div 2将100%替换Div 1的空间。明白了——我认为这可以通过调整手风琴代码来实现：）祝你好运！

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