Question

我正在使用jQuery Cycle插件来旋转混合的图像和FLV视频。对于图像，我有固定的超时持续时间为3000毫秒，但对于视频，它基于视频长度，这是我的问题开始。我总是得到第一个视频的持续时间：

var value = 0;

 $(document).ready(function() {
  $('.slideshow').cycle({

    fx:'scrollLeft,scrollRight',
    speed:   1500,
    timeoutFn: valueFn
    });

 function valueFn(currElement, nextElement, opts, isForward){

  value = parseInt($('#duration').val());
  return value;
 }
});
...
...
<div id="image">

 <ul class="slideshow">
  <?php
  $dir = "media/images";

  if (is_dir($dir)) {
     if (($dh = opendir($dir))) {
        $i = 0;
        $name = 'FLVPlayer';
        while (($file = readdir($dh)) !== false) {
          if ($file == '.' || $file == '..')
              continue;

          $ext = explode(".", $file);
          if (@$ext[1] == null)
               continue;

     switch ($ext[1]) {
      case "jpg":
       echo "<input type=\"hidden\" id=\"duration\" name=\"val\" value=\"3000\" />
       <li><img src=\"media/images/" . $file . "\" width=\"848\" height=\"608\" /></li>";
       break;
      case "flv":
       $flv = fopen("media/images/".$file, "rb");
       fseek($flv, -4, SEEK_END);
       $arr = unpack('N', fread($flv, 4));
       $last_tag_offset = $arr[1];
       fseek($flv, -($last_tag_offset + 4), SEEK_END);
       fseek($flv, 4, SEEK_CUR);
       $t0 = fread($flv, 3);
       $t1 = fread($flv, 1);
       $arr = unpack('N', $t1 . $t0);
       $milliseconds_duration = $arr[1];
       $milliseconds_duration;

$html = <<<HTML
                <input type="hidden" id="duration" value="{$milliseconds_duration}" />
                <li>
                <div id="container{$i}">Loading the player ...</div>

                <script type="text/javascript">
                                                               jwplayer("container{$i}").setup({

 flashplayer: "js/player.swf",
 file: "media/images/{$file}",
 height: 608,
 width: 848,
 "controlbar.idlehide": true,
 icons: false,
 events: {
     onReady: function() { this.play(); }
  }
 });

 </script>
</li>  

HTML;

 echo $html;
 $i++;
 break;
 case "txt":
          $myFile = "media/images/" . $file;
          $fh = fopen($myFile, 'r');
          $theData = fread($fh, filesize($myFile));
          fclose($fh);
          echo "<li>" . $theData . "</li>";
          break;
   }
  }
 }
closedir($dh);
}
?>

PHP代码只需通过一个目录，查找文件并回显FLV，图像或文本的相应HTML代码。如果我使用固定的超时值，那么其他一切都可以正常工作。

Answer 1

看起来您正在将一些图片和视频输出到一个页面上，但是，它们都具有相同的ID - duration. ID必须是唯一的。否则这一行

value = parseInt($('#duration').val());

只是抓住具有该id的第一个元素并获取其值。也许您应该考虑使用html5 data attribute来保存视频长度。

<div id="item1" data-length="3000"></div>
var time = $('currElement').attr('data-length');

或者您需要为隐藏元素提供唯一ID，并以另一种方式获取它们。

jQuery循环插件图像和视频的动态超时

1 个答案: