计算 prev() 的 jquery 高度并将其与当前相加或相减答案

【问题标题】：Calculate jquery height of prev() and add or subtract it to current计算 prev() 的 jquery 高度并将其与当前相加或相减
【发布时间】：2012-07-29 13:49:33
【问题描述】：

我有一个名为 myDiv 的 css 类，当单击缩略图时它会向下滑动：

#myDiv
{
  height:800px;
  margin:0 auto;
  width:100%:
}

当用户点击缩略图时，myDiv 将显示为 800 像素高。因为myDiv 有多个高度不同的缩略图，例如点击缩略图 1 将使myDiv 700px 高和缩略图 2 200px 高，有没有办法使用 jQuery 动态计算高度？

由于我不精通这种语言，我只能描述场景，所以这里......

jQuery: 1.点击1：点击缩略图1时，得到myDivclass=700px的高度并向下滑动 2、点击2：当点击缩略图2时，获取上一个类（700px）和当前类（200px）的高度，并相减确定上下滑动的值（700px - 200px = 500px）。

有没有办法计算myDiv 的先前和当前高度，使其向上或向下滑动到相应的高度？

非常感谢您的帮助。

编辑：CSS 和 jQuery

#box
{
max-width:1140px;
margin: 0 auto;
display: inline-block;

}

html[xmlns] #portfoliocontainer {
display: block;
}

* html #portfoliocontainer {
height: 1%;
}

#portfoliocontainer:after {
clear: both;
content: ".";
display: block;
height: 0;
line-height: 0;
visibility: hidden;
}

jQuery 是：

$('#box').hide();
$('#myDiv').hide();
$('.portfolio-area').click(function(){
$('#myDiv').hide();

$('#box').slideDown('slow');
$('#myDiv').fadeTo('slow',1);

});

【问题讨论】：

你只是想让 myDiv 以动态高度向下滑动吗？
嗨 Huangism，是的，没错。 myDiv 中显示的内容具有不同的高度。我知道 jQuery 在向上或向下滑动动画时使用 min-height 存在错误。我只希望 myDiv 适合正在显示的内容的高度。
我认为最简单的方法是获取 myDiv 的先前高度和当前值并减去它以获得以像素为单位的向上或向下滑动值，以实现平滑动画。
您如何更改内容？你能举一个关于小提琴的简单例子吗？我在想，如果您的内容发生变化，那么您不需要为其设置动画高度，它应该是自动高度，因此它会向下滑动到内容填充它的位置
我已经在我的网站上上传了我的最新示例：circularchaos.com/jq。使用 AJAX 动态更改内容。我需要设置一个高度，因为 myDiv 下方还有其他内容。因此，当 myDiv 打开下面的内容时，会被下推。目前 myDiv 的高度设置为 850px。当您单击缩略图时，您可以看到 myDiv 具有固定的高度，因此即使内容很小，下面仍然会有空白。我尝试将高度设置为自动，但幻灯片动画中断并且 myDiv 与下面的内容重叠 - 谢谢

标签： jquery dynamic height slide

【解决方案1】：

我认为您需要的是 clearfix。你可以 clearfix #portfolio div conainer 并删除定义的高度，然后一切都很好

http://www.webtoolkit.info/css-clearfix.html

投资组合div中的li是浮动的，因此div没有获得clearfix将修复的任何高度，那么高度将是动态的而不定义它。

对于一个简单的测试添加这个并删除添加高度部分

#portfoliocontainer:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
}

您应该创建 clearfix 类并将其添加到该 id

【讨论】：

感谢黄教。您的解决方案确实通过使用 clearfix 解决了高度问题。内容适合“myDiv”。但现在我的滑块与下方的缩略图重叠，并且 jQuery 幻灯片动画正在“跳跃”。 myDiv 是单击缩略图时显示的隐藏 div。 “嗨”内容只是另一个单独的测试。是否有另一种方法可以在显示之前预先计算 div 的高度？因为它必须是动态的，所以我也需要前一个 div 的高度。我认为这是主要问题 - 谢谢！
网站上的 clearfix 更新了吗？我需要看到这个，以便我了解问题
@Raja 实际上，首先删除高度设置。 ajax 正确填充内容后，获取 ul.portfolio-area 的高度，然后设置高度，使其成为新高度。为测试创建一个克隆页面
更新现已上线。抱歉，我会从现在开始更新所有更改。此外，隐藏 div 的名称实际上是 #box 而不是 #myDiv :) 正如您所看到的，div 的高度仅包括文本并忽略幻灯片。
无论显示多少图标，ul 上仍然设置高度，您可以将 js 发布在设置高度的位置吗？