有个需求，图片展示，下面是缩略图，上面是大图，缩略图左右侧有上下故事，可以全屏播放
一点思路都没有，找高手指点
效果：
http://slide.news.sina.com.cn/s/slide_1_2841_13699.html#p=4非常非常急！分不是问题，希望大家帮忙
一点思路都没有，找高手指点
效果：
http://slide.news.sina.com.cn/s/slide_1_2841_13699.html#p=4非常非常急！分不是问题，希望大家帮忙
<%!--#include file="bottom.asp"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>首页</title>
<style>
.ad3{ float:left; width:350px; height:245px; overflow:hidden; margin:0; padding:0;}
/*******轮换图片************/
.ad3right{ float:left; width:348px; height:243px; border:1px solid #CCCCCC; margin:0; padding:0; display:inline;}
.ad3right1{ float:left; width:348px; height:18px; background:#999999;position:relative; bottom:18px; left:0;filter:alpha(opacity=80);}
#biaoshi{ padding:0; margin:0; list-style-type:none; width:348px; position:relative; bottom:0; left:204px; float:left;}
#biaoshi li{ float:left; height:18px; padding:0 10px; text-align:center; display:block; background:#000000; color:#FFFFFF; cursor:hand; border-right:1px solid #FFFFFF;}
.ad3right2{ float:left; width:348px; height:243px;}
#pic{ padding:0; margin:0; list-style-type:none;}
.picimg{ float:left; width:348px; height:243px; overflow:hidden;}
.picimg img{ display:block; width:348px;}
#biaoshi #show{background:#dd9;color:#f00;}
</style>
<script language="javascript">
function cha(n){
for(i=0;i<biaoshi.childNodes.length;i++)
biaoshi.childNodes[i].id="";
biaoshi.childNodes[n].id="show";
for(i=0;i<pic.childNodes.length;i++){
pic.childNodes[n].style.filter="progid:DXImageTransform.Microsoft.RandomDissolve(Duration=1,orientation=vertical)";
pic.childNodes[n].filters[0].Apply();
pic.childNodes[i].style.display="none";
pic.childNodes[n].filters[0].Play();
}
pic.childNodes[n].style.filter="progid:DXImageTransform.Microsoft.RandomDissolve(Duration=1,orientation=vertical)";;
pic.childNodes[n].filters[0].Apply();
pic.childNodes[n].style.display="block";
pic.childNodes[n].filters[0].Play();
}
</script>
</head>
<body>
<div class="ad3">
<div class="ad3left"></div>
<div class="ad3right">
<ul id="pic">
<li class="picimg"><img src="a111.jpg"/></li>
<li class="picimg"><img src="a111.jpg"/></li>
<li class="picimg"><img src="a111.jpg"/></li>
<li class="picimg"><img src="a111.jpg"/></li>
<li class="picimg"><img src="a111.jpg"/></li>
</ul>
<div class="ad3right1">
<ul id="biaoshi">
<li onclick="cha(0)">1</li>
<li onclick="cha(1)">2</li>
<li onclick="cha(2)">3</li>
<li onclick="cha(3)">4</li>
<li onclick="cha(4)">5</li>
</ul>
</div>
</div>
</div>
<script language="javascript">cha(0)</script>
</body>
</html>
懒人库里我找过的，能试的例子都试过了，比如“可全屏展示的Flash相册”例子，左上角有个图层，我试过去掉，可是把那个flash反编译后原本100多k的内容就变成了10多k了，明显的有问题，我对flash也不懂，没办法只能放弃。
再比如“可以全屏的Flash+xml相册”这个例子里的缩略图是单独的小图，我想把大图设置宽和高变成缩略图显示，结果flash里是用loadmovie方法，这个方法是个延时加载，不能马上获得_width和_height，也试着改了，结果是刚开始播放flash的时候，缩略图不显示，显示的是加载中状态，点下一张就能出来一个，点下出来一个，问题出在哪里我也不清楚，现在真是一片茫然啊。
theforever所说的例子我看过了，没有全屏播放效果各位我现在该怎么办咧？╮(╯▽╰)╭