Javascript 车把模板和bxSlider

在试图创建垂直旋转木马的Handlebar模板中，bxSlider实现遇到了一些问题。我等待窗口完全加载后调用滑块，但bxviewport似乎没有计算高度

问题是，当它移动一张幻灯片时，视口高度会下降到0。我认为这是由于添加了带有模板的html内容。bxSlider可能比模板提供的内容填充幻灯片更快地获得幻灯片的高度

<div class="tweetDeck"  >
                        <p style="text-align:center"><a href="#"><img width="30px" src="../images/twitter.png"></a>#topic</p>

                        <ul class="tweets">
                            <script id="tweets-template" type="text/x-handlebars-template">
                                {{#each this}}
                                <li class="vSlide" height="150px">

                                    <p>{{tweet}}<br/>
                                    {{author}}
                                </li>
                                {{/each}}
                            </script>


                        </ul>
                </div>
                <script>
                //This is where I call the slider

                $(window).bind('load',function(){

                    $('ul.tweets').bxSlider({
                    auto:false,
                    minSlides:3,
                    maxSlides:3, 
                    moveSlides:1,
                    mode:'vertical',
                    pager:false,
                    controls:true,
                    slideSelector:'li.vSlide',



                    });
                    //This code bellow is useless, it's overrided after the first slide 
                    $('.tweets').parent('.bx-viewport').css({
                        'height':500
                    })

                })


                </script>

主题


{{{#每个这个}

{{tweet}}

{{作者}

{{/每个}}

//这就是我称之为滑块的地方
$（窗口）.bind（'load'，function（）{
$（'ul.tweets'）.bxSlider({
汽车：错，
米斯利德斯：3，
maxSlides:3，
第一,，
模式：'垂直'，
传呼机：错，
控制：对，
幻灯片选择器：'li.vSlide'，
});
//下面的代码没有用，在第一张幻灯片之后会被覆盖
$（'.tweets'）.parent（'.bx视口'）.css({
‘高度’：500
})
})

正如我所说，输出结果是第一次移动后视口的高度值为0。我在没有模板的情况下试过，效果很好

以前有人试过这个吗

---

谢谢

解决方案

我终于用计时器解决了这个问题，检查了li的长度。一旦ul填充了模板，我就调用slider函数，bxSlider可以正确计算其大小

 function checkFeedsTimer() {
                        var feeds = $('.tweets li').length;
                        console.log(feeds)
                        if (feeds > 0 ){
                            $('ul.tweets').bxSlider({
                                auto:false,
                                minSlides:3,
                                maxSlides:3, 
                                moveSlides:1,
                                mode:'vertical',
                                pager:false,
                                controls:true,
                                slideSelector:'li.vSlide',          
                            });

                        }else{
                            setTimeout(checkFeedsTimer, 500);
                        }

                    }

                    checkFeedsTimer();