JQuery Slider和ZF1产生的图像比预期的短得多

Question

我正在尝试使用jquery内容滑块（即bxslider，url：http://bxslider.com/）以及zend framework v1.12。使用下面的代码，我可以幻灯片显示图像及其标题，但预期的图像大小只有很短的285x165，而根据我的css代码的搜索图像尺寸应该至少为590x341。我无法确定问题出在哪里？我没有运气就尝试了各种设置。

    <?php
  $this->script()->appendFile($this->APP_STATIC_URL . '/templates/default/js/jquery.bxslider.js');
?>
<?php
  if ($this->numArticles > 0):
?>

 <div class="bx-wrapper" style="max-width: 100%;">
 <div class="bx-viewport" style="width: 100%; overflow: hidden; position: relative; height: 341px;">
    <ul class="bxslider" style="width: 3215%; position: relative; transition-duration: 0s; transform: translate3d(-1180px, 0px, 0px);">

    <?php
      foreach ($this->articles as $article):
?>
    <li style="float: left; list-style: none; position: relative; width: 590px;" class="bx-clone">
    <div class="slider-image">
    <a href="/health/foods-cause-cancer" title="Foods and Cancer: We Expose Suspect Science">
        <img typeof="foaf:Image" src="<?php
          echo $article->getCover('original');
?>" width="648" height="375" alt="" title="Foods and Cancer: We Expose Suspect Science"></a>
    </div>
    <div class="slider-content">
        <h2 class="slider-title">
            <a href="/health/foods-cause-cancer" title="Foods and Cancer: We Expose Suspect Science"><?php
          echo $article->title;
?></a></h2>
    </div>
    </li>
    <?php
      endforeach;
?>

    </ul>
    </div>
    <div class="bx-controls bx-has-controls-direction bx-has-pager">
    <div class="bx-controls-direction">
        <a class="bx-prev" href="">Prev</a>
        <a class="bx-next" href="">Next</a>
    </div>
   </div>
 </div>

       <?php
      $this->script()->captureStartOnce('bx-wrapper');
?>
$(document).ready(function(){
  $('.bx-wrapper .bx-viewport .bxslider').bxSlider({
        auto: true,

    });
});
<?php
      $this->script()->captureEndOnce('bx-wrapper');
?>
<?php
  endif;
?>