Получить высоту div после загрузки в него динамического контента javascript - PullRequest
1 голос
/ 17 ноября 2011

Я только что понял, что напутал в своем последнем вопросе.

Я использую этот скрипт ниже, чтобы получить динамическую высоту в DIV # tweet-area и вставить эту высоту в CSS.

    var tweetheight = $("#tweet-area").height();
    $("#sidebar-wrapper").css({ bottom: tweetheight});

Это работает просто так, но я только что понял, какую высоту он получает, это высоту div перед загрузкой моего твиттер-контента.Мой твиттер-контент генерируется плагином jQuery, см. Ниже.

Я использую этот плагин jQuery twitter - tweet.seaofclouds.com / jquery.tweet.js

И загружаю скрипт так:

    $("#latest-tweet").tweet({
        count: 1,
        username: ["motocomdigital"],
        loading_text: "searching twitter...",
    });

Я загружаю твиты в DIV # latest-tweet, который находится внутри DIV # tweet-area.См. Ниже

    <div id="tweet-area" class="clearfix">
        <div id="latest-tweet"></div>   
    </div>

Я пытался добавить свой скрипт высоты после скрипта twitter, но все равно получал такую ​​же высоту: /

    <script>
        $(document).ready(function() {

                $("#latest-tweet").tweet({
                        count: 1,
                        username: ["motocomdigital"],
                        loading_text: "searching twitter..."
                });

                var tweetheight = $("#tweet-area").height();
                $("#sidebar-wrapper").css({ bottom: tweetheight});

        });
    </script>

Любая помощь будет отличной, так как это небольшой эксперт помне.Большое спасибо

Ответы [ 3 ]

3 голосов
/ 17 ноября 2011

Попробуйте что-то вроде:

    <script>
        $(document).ready(function() {

                $("#latest-tweet").tweet({
                        count: 1,
                        username: ["motocomdigital"],
                        loading_text: "searching twitter..."
                }).bind("loaded", function(){
                        tweetheight = $("#tweet-area").height();
                        $("#sidebar-wrapper").css({ bottom: tweetheight});
                });
        });
    </script>

Это реализует плохо документированный вызывающий объект в полученном вами плагине, который является вызовом обработчика loaded после запуска кода.Удачи!

2 голосов
/ 17 ноября 2011

Плагин seaofclouds не имеет обратного вызова, вместо этого у него есть событие loaded, которое вызывается, когда загрузка твитов завершена.

Поэтому для вас должно работать следующее:

$("#latest-tweet").tweet({
    count: 1,
    username: ["motocomdigital"],
    loading_text: "searching twitter..."
})
.bind("loaded", function() {
    var tweetheight = $("#tweet-area").height();
    $("#sidebar-wrapper").css({ bottom: tweetheight});
});                
1 голос
/ 17 ноября 2011

в строке 229 плагина, который вы прочитали

$(widget).trigger("loaded")

запускает событие loaded в сообщении, к которому вы добавили твит. Так что вы могли бы сделать

$("#latest-tweet").tweet({    
    // options
}).bind("loaded", function(){
    // calc height
});
...