Question

我一直在与JQuery的问题争斗2个小时而我无法得到任何东西。

我正在用div幻灯片创建一个网站，好吗？所以你有一个叫做#content的主要div，而在里面我有另一个叫做#slides的div。但我想要其中4个，所以再一次，我有4个部分。

有什么问题？每个部分都有自己的高度，所以#slides高度是它们中最高的，这使得页脚看起来非常低，有很多空白。因此我每次更改您的部分时都尝试使用JQuery更改#slides高度，以便为页脚保留相同的边距并且始终具有相同的空白部分，但我不知道如何才能执行此操作。

所以我在搜索doc，我知道我必须使用animate（）方法，就像这样

$('#slides').stop().animate({marginLeft:-positions[pos]+'px'},450);

我只需要添加一个上传当前高度的新css属性。但是我怎么能这样做呢？我不知道JQuery的任何想法。

我是新手，这些美好的东西对我来说都是新的，我试图自己发现所有这些，但在某些时刻，我不知道如何修复它继续... 。

谢谢！

编辑：第一次，在任何人都可以看到信息之前，您可以将高度设置为第一张幻灯片。使用$('#slides').height($('.slide').height());非常简单我的问题是每次按下按钮时都会将高度更新到新部分。

Answer 1

您需要一种方法来识别哪些幻灯片是当前活动的幻灯片。

在您的编辑中，您的内部表达式$('.slide').height()应该被细化为仅匹配您想要的那个。这是因为$('.slide')匹配幻灯片的所有。（因此只返回第一个的高度。）

但是，如果您在当前可见幻灯片上有“活动”或“当前”类，或者您知道正在显示幻灯片的索引/编号，则可以对其进行优化。例如，$('.slide.current')或$('.slide').eq(idx)

也许如果你能够详细说明你在“按下按钮”时运行的代码，我们可以看到在那里添加一些额外的东西来帮助我提到的这个识别。然后你可以将高度修改添加到你已经调用左边距的相同动画方法中。

祝你好运！

Answer 2

好的，我相信我终于解决了它。我试图用一些id来识别部分（.slide），但是我已经动态生成部分的PHP代码，所以我不知道如何以这种方式放置不同的id。

出于这个原因，我尝试了一个更容易和不同的想法。在JS脚本上有一个前一个循环，它获取所有.slide的宽度并计算总宽度，以便稍后将总宽度分配给容器#slides。所以我为高度做了同样的事情

var heights = new Array();

/* Loop to save every height */    
$('#slides .slide').each(function(i) {
     heights[i] = $(this).height();
}

/* Setting the #slides height to the first .slide height */
$('#slides').height($('.slide').height());

/* And finally, the animation when someone "push the button" */
$('#menu ul li a').click(function(e,keepScroll) { 
     var pos = $(this).parent().prevAll('.menuItem').length;
     $('#slides').stop().animate( {height:heights[pos]+'px'}, 450);
}

谢谢大家。我是一个如此大的菜鸟，但我发现我喜欢网页设计^^

使用JQuery更改元素的属性

2 个答案: