Question

我有一个动态加载信息的页面。内容加载，但问题是保存内容的div（content_container）导致页面大小增加（这是预期的），但它导致页脚，标题和content_type_container被修复。如果在加载内容后调整html元素，我希望它。

这是html：

<div id="content_container">

            </div>      

            <div id="content_type_container" style="display:none;">
                <div  class="content_type">
                    Content Type 1
                    <input type="hidden" value="1" class="content_type_value"/>
                </div>
                <div  class="content_type">
                    Content Type 2
                    <input type="hidden" value="2" class="content_type_value"/>
                </div>


            </div>

这是jquery：

$(document).ready(function() {



    $(".content_type").click(function() {
        var content_type = $(this).find(".content_type_value").val();   
        content_type = $.trim(content_type);
            if(content_type)
            {
                $.ajax({
                    url: "content_type_ajax.php",
                    data: "content_type="+content_type,
                    success: function(msg) {
                    $("#content_container").html(msg);
                    $("#content_container").click(); /* adding this reset the header and footer divs to the new height of the content container. fixing the issue */                            
                }
                });
            }   
        });

        $("#content_type_nav").click(function() {
            $("#content_type_container").slideToggle("fast");


        });
        $(".content_type").click(function() {
            $("#content_type_container").slideToggle("fast");


        });
});

和css：

#content_container{
    display:block;


}

#content_type_container{
    position:fixed;
    display:block;
    bottom:0px;
    width:100%;
    z-index:1000;

}



.content_type{
    display:block;
    width:100%;
    text-align:center;

}


.content_type:hover{
    background:blue;
    color:white;

}

Answer 1

请尝试职位：亲属;而不是固定的

为#content_type_container提供固定高度和溢出，如果您使用滚动条查找固定高度

Answer 2

如果你设置了重要的css元素，那么它应该按你想要的那样工作

#content_type_container{
    position:fixed !important;
    display:block;
    bottom:0px;
    width:100%;
    z-index:1000;
}

加载内容后没有页面刷新的html元素问题

2 个答案: