我正在使用jwplayer和yoxview插件来播放本地视频和awshowcase插件以获得滑动效果。但是有一个问题,第一个div.thumbnails中的视频工作正常,而如果我滑到任何其他div.thumbnails并点击视频 它显示“找不到对象!”页。请帮帮我......我被困了
这是我的代码:
<script type="text/javascript" src="yoxview/yoxview-init.js"></script>
<script type="text/javascript" src="scripts/jquery.aw-showcase.min.js"></script>
<script type="text/javascript" src="jwplayer/jwplayer.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#showcase").awShowcase(
{
content_width: 1024,
content_height: 470,
fit_to_parent: true,
auto: false,
interval: 3000,
continuous: false,
loading: true,
arrows: true,
buttons: false,
btn_numbers: false,
keybord_keys: true,
mousetrace: false, /* Trace x and y coordinates for the mouse */
pauseonover: true,
stoponclick: true,
transition: 'hslide', /* hslide/vslide/fade */
transition_speed: 500,
transition_delay: 300,
show_caption: 'onhover', /* onload/onhover/show */
thumbnails: false,
thumbnails_position: 'outside-last', /* outside-last/outside-first/inside-last/inside-first */
thumbnails_direction: 'horizontal', /* vertical/horizontal */
thumbnails_slidex: 0, /* 0 = auto / 1 = slide one thumbnail / 2 = slide two thumbnails / etc. */
dynamic_height: true, /* For dynamic height to work in webkit you need to set the width and height of images in the source. Usually works to only set the dimension of the first slide in the showcase. */
speed_change: false, /* Set to true to prevent users from swithing more then one slide at once. */
viewline: false /* If set to true content_width, thumbnails, transition and dynamic_height will be disabled. As for dynamic height you need to set the width and height of images in the source. */
});
$(".thumbnails").yoxview({
flashVideoPlayer: 'jwplayer',
flashVideoPlayerPath: 'jwplayer/player.swf',
renderInfoExternally: true
});
});
</script>
<div id="showcase" class="showcase">
<!-- Each child div in #showcase represents a slide -->
<div class="showcase-slide">
<!-- Put the slide content in a div with the class .showcase-content. -->
<div class="showcase-content">
<!-- If the slide contains multiple elements you should wrap them in a div with the class .showcase-content-wrapper. -->
<div class="showcase-content-wrapper">
<!-- For dynamic height to work in webkit you need to set the width and height of images in the source.
Usually works to only set the dimension of the first slide in the showcase. -->
<div class="thumbnails">
<a href="media/2.flv?image=media/thumbnails/2.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/2.jpg" alt="First" title="The first image" /></a>
<a href="media/3.flv?image=media/thumbnails/3.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/3.jpg" alt="First" title="The SECOND image" /></a>
<a href="media/4.flv?image=media/thumbnails/4.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/4.jpg" alt="First" title="The THIRD image" /></a>
<a href="media/5.flv?image=media/thumbnails/5.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/5.jpg" alt="First" title="The fourth image" /></a>
<a href="media/6.flv?image=media/thumbnails/6.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/6.jpg" alt="First" title="The FIFTH image" /></a>
<a href="media/1.flv?image=media/thumbnails/1.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/1.jpg" alt="First" title="The SIXTH image" /></a>
</div>
</div>
</div>
</div>
<!-- Each child div in #showcase represents a slide -->
<div class="showcase-slide">
<div class="showcase-content">
<div class="showcase-content-wrapper">
<div class="thumbnails">
<a href="media/1.flv?image=media/thumbnails/1.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/1.jpg" alt="First" title="The first image" /></a>
<a href="media/2.flv?image=media/thumbnails/2.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/2.jpg" alt="First" title="The SECOND image" /></a>
<a href="media/3.flv?image=media/thumbnails/3.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/3.jpg" alt="First" title="The THIRD image" /></a>
<a href="media/4.flv?image=media/thumbnails/4.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/4.jpg" alt="First" title="The fourth image" /></a>
<a href="media/5.flv?image=media/thumbnails/5.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/5.jpg" alt="First" title="The FIFTH image" /></a>
<a href="media/6.flv?image=media/thumbnails/6.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/6.jpg" alt="First" title="The SIXTH image" /></a>
</div>
</div>
</div>
</div>
<!-- Each child div in #showcase represents a slide -->
<div class="showcase-slide">
<div class="showcase-content">
<div class="showcase-content-wrapper">
<div class="thumbnails">
<a href="media/1.flv?image=/media/thumbnails/1.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/1.jpg" alt="First" title="The first image" /></a>
<a href="media/2.flv?image=/media/thumbnails/2.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/2.jpg" alt="First" title="The SECOND image" /></a>
<a href="media/3.flv?image=/media/thumbnails/3.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/3.jpg" alt="First" title="The THIRD image" /></a>
<a href="media/4.flv?image=media/thumbnails/4.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/4.jpg" alt="First" title="The fourth image" /></a>
<a href="media/5.flv?image=media/thumbnails/5.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/5.jpg" alt="First" title="The FIFTH image" /></a>
<a href="media/6.flv?image=media/thumbnails/6.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/6.jpg" alt="First" title="The SIXTH image" /></a>
</div>
</div>
</div>
</div>
<!-- Each child div in #showcase represents a slide -->
<div class="showcase-slide">
<div class="showcase-content">
<div class="showcase-content-wrapper">
<div class="thumbnails">
<a href="media/1.flv?image=/media/thumbnails/1.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/1.jpg" alt="First" title="The first image" /></a>
<a href="media/2.flv?image=/media/thumbnails/2.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/2.jpg" alt="First" title="The SECOND image" /></a>
<a href="media/3.flv?image=/media/thumbnails/3.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/3.jpg" alt="First" title="The THIRD image" /></a>
<a href="media/4.flv?image=media/thumbnails/4.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/4.jpg" alt="First" title="The fourth image" /></a>
<a href="media/5.flv?image=media/thumbnails/5.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/5.jpg" alt="First" title="The FIFTH image" /></a>
<a href="media/6.flv?image=media/thumbnails/6.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/6.jpg" alt="First" title="The SIXTH image" /></a>
</div>
</div>
</div>
</div>
<!-- Each child div in #showcase represents a slide -->
<div class="showcase-slide">
<div class="showcase-content">
<div class="showcase-content-wrapper">
<div class="thumbnails">
<a href="media/1.flv?image=/media/thumbnails/1.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/1.jpg" alt="First" title="The first image" /></a>
<a href="media/2.flv?image=/media/thumbnails/2.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/2.jpg" alt="First" title="The SECOND image" /></a>
<a href="media/3.flv?image=/media/thumbnails/3.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/3.jpg" alt="First" title="The THIRD image" /></a>
<a href="media/4.flv?image=media/thumbnails/4.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/4.jpg" alt="First" title="The fourth image" /></a>
<a href="media/5.flv?image=media/thumbnails/5.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/5.jpg" alt="First" title="The FIFTH image" /></a>
<a href="media/6.flv?image=media/thumbnails/6.jpg&width=640&height=480"><img src="jwplayer/media/thumbnails/6.jpg" alt="First" title="The SIXTH image" /></a>
</div>
</div>
</div>
</div>
</div>