Question

我需要在模板中修复此行为：

模板以绝对位置打印文章标签序列中的所有帖子，并将其顶部设置在完美顶部位置以避免重叠。

<div main>
    <article1 style="position absolute; top: 0px;"></article1> <!-- Have 210px of hegiht --!>
    <article2 style="position absolute; top: 211px;"></article2>
    ...
</div main>

嗯，一切都很好，但现在他们已经实现了一个faqs列表插件，这些常见问题使用幻灯片来显示内容，当faqs divs因为hegight更改而显示内容时增长，下一篇文章top don t移动，重叠。

我需要在代码中以较少侵入性的方式更改此内容。我创建了一个代码，用于将下一个元素从faq文章的底部位置移动一个固定的像素，但是当faqs不是倒数第二个元素时，这是一个问题。我在这里留下一个我用结构创建的小例子。

有什么想法可以解决这个问题吗？

https://jsfiddle.net/05onf82y/

我用来解决这个问题的旧代码：

 jQuery(".ewd-ufaq-post-margin").click(function(){ //FAQ TITLE

            setTimeout(function(){
                FAQheight = 0;
                jQuery(".ewd-ufaq-post-active").each(function(){//FAQ CONTENT DIV
                    var _this = jQuery(this);
                    FAQheight += _this.height();
                });

                var faqsElement = jQuery(".ufaq-faq-list");
                var faqsParent = faqsElement.parents('article'); //FAQS ARTICLE PARENT
                var nextElement = faqsParent.next();
                var offset = faqsParent.offset();
                var top = offset.top;
                var bottom = top + faqsParent.outerHeight();

                faqsParent.nextAll("article[id^=post]").each(function(){
                    jQuery(this).css("top", bottom + 35);
                    //jQuery(this).css("top", nextElement.position().top + FAQheight);
                });



            }, 10);
        });

更改绝对div在高度变化时的位置

0 个答案: