Получить высоту div после загрузки в него динамического содержимого javascript

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

Я использую этот сценарий ниже, чтобы получить динамическую высоту в 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>

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

    <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>

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


html jquery dom var height
person Joshc    schedule 17.11.2011    source источник

Ответы (3)


arrow_upward
3
arrow_downward

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

    <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 после запуска кода. Удачи!

person Vap0r    schedule 17.11.2011
comment
Идеальный чувак, большое спасибо, чувак! - Спасибо, что заглянули, я бы не нашел этого обработчика - хотя раньше я никогда не использовал .bind, но теперь обязательно. - person Joshc; 17.11.2011

arrow_upward
2
arrow_downward

Плагин 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});
});
person Rory McCrossan    schedule 17.11.2011

arrow_upward
1
arrow_downward

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

$(widget).trigger("loaded")

это вызывает событие loaded в div, на котором вы связали твит. Так ты мог бы сделать

$("#latest-tweet").tweet({    
    // options
}).bind("loaded", function(){
    // calc height
});
person Manuel van Rijn    schedule 17.11.2011
comment
Да, только что заглянул внутрь плагина - спасибо, что объяснили мне это, очень помог! - person Joshc; 17.11.2011
comment
привет, я знаю, что это немного дерзко, но, поскольку вы уже знакомы с моей проблемой ранее, не могли бы вы взглянуть на этот http://goo.gl/NWNx8 - можете сделать пожертвование через PayPal, если можете :) - person Joshc; 18.11.2011
comment
Привет, попробуйте это как переписанный вопрос stackoverflow.com/questions/8176034/ - спасибо - person Joshc; 18.11.2011