网页中的幻灯片如何制作
发布网友
共4个回答
懂视网
热心网友
步骤一：图形元素的制作和准备。
制作幻灯片所用的图片并将之放入Dreamweaver的层中。我们准备在每个幻灯片中实现7幅图片的交替变换，因此我们需要制作7幅内容不同的图片。注意图片要在Photoshop中进行优化压缩，并调整成相同的尺寸。建立一个层，插入初始图片，该图片就是幻灯片默认得头一张图片。将层命名为Layer_main，并把该层的Index值设为1。
步骤二：制作播放器的外观和四个控制按钮。
利用Photoshop制作一个金属效果的播放器外观。（具体效果就看你的喜好啦，也许你可从Winamp的skin中受点启发）。作最佳优化后，输出一个透明的GIF图片。为了让鼠标移上后按钮有些变化，你不得不每个按钮制作2张图片（共6个），两个按钮只需有颜色上的差异即可。先建三个层，调整好位置，并插入三个播放键的各自的二张翻滚图片（Rollover Image）（Insert-Rollover Image）。通过调节层的Index-Z的值，确保播放器所在的层在Layer_main层的上面，在按钮所在层的下面。排版好的各层。
步骤三：创建幻灯片播放时间链。
按Ctrl+F9键打开时间链浮动工具面板。选取其中幻灯片所在层(Layer_main)中的初始图片(确保选取的是图像，而不是层)，用鼠标拖至时间链浮动工具面板，在时间链起始处释放鼠标。设定帧速率为Fps为5，并勾选Loop框。选择时间链中的其中一帧，右击鼠标，选择"Add Keyframe"（添加关键帧），选择另一幅幻灯片图片，以更换层(Layer_main)中的初始图片。重复这个操作，将剩下的5幅图片全部加到该时间链的不同关键帧上。最后适当调节各关键帧之间的距离。并将该时间链命名为TimeLine_main。建立好的时间链。
步骤四：为按钮和其它添加行为（Behavior）。
点击选择PLAY按钮所在的图片，在行为浮动工具面板中，从+（添加）动作下拉列表中选择Timeline-Play Timeline(播放时间链)，并在弹出的对话框中选择时间链Timeline_main。单击OK。默认方式下，就会为切换动作设置一个onClick事件。点击选择PAUSE所在的图片。在行为浮动工具面板中，从+（添加）动作下拉列表中选择Timeline---Stop Timeline(停止播放时间链)，并在弹出的对话框中选择时间链Timeline_main。单击OK。默认方式下，就会为切换动作设置一个onClick事件。
点击选择REPLAY所在的图片。在行为浮动工具面板中，从+（添加）动作下拉列表中选择Timeline---Go to Timeline Frame(转向放时间链帧)，并在弹出的对话框中选择时间链Timeline_main，在Frame文本框中输入1。单击OK。默认方式下，就会为切换动作设置一个onClick事件。再添加下一个动作。从+（添加）动作下拉列表中选择Timeline---Play Timeline(播放时间链)，并在弹出的对话框中选择时间链Timeline_main。单击OK。默认方式下，就会为切换动作设置一个onClick事件。REPLAY的图片添加好的行为。
进一步，为了让播放器更加生动，你可以同时给幻灯片的播放加上声音。
热心网友
<!-- 把如下代码加入<body>区域中 -->
<!-- http://www.webjx.com/js -->
<!-- bbs http://www.webjx.com/bbs-->
<script language=JavaScript>
<!-- // BannerAD
var bannerAD=new Array();
var bannerADlink=new Array();
var adNum=0;
bannerAD[0]="/img/200406301.jpg";
bannerADlink[0]="/js";
bannerAD[1]="/img/200406302.jpg";
bannerADlink[1]="/js";
bannerAD[2]="/img/200406303.jpg";
bannerADlink[2]="/js";
bannerAD[3]="/img/200406304.jpg";
bannerADlink[3]="/js";
bannerAD[4]="/img/200406305.jpg";
bannerADlink[4]="/js";
var preloadedimages=new Array();
for (i=1;i<bannerAD.length;i++){
preloadedimages[i]=new Image();
preloadedimages[i].src=bannerAD[i];
}
function setTransition(){
if (document.all){
bannerADrotator.filters.revealTrans.Transition=Math.floor(Math.random()*23);
bannerADrotator.filters.revealTrans.apply();
}
}
function playTransition(){
if (document.all)
bannerADrotator.filters.revealTrans.play()
}
function nextAd(){
if(adNum<bannerAD.length-1)adNum++ ;
else adNum=0;
setTransition();
document.images.bannerADrotator.src=bannerAD[adNum];
playTransition();
theTimer=setTimeout("nextAd()", 5000);
}
function jump2url(){
jumpUrl=bannerADlink[adNum];
jumpTarget='_blank';
if (jumpUrl != ''){
if (jumpTarget != '')window.open(jumpUrl,jumpTarget);
else location.href=jumpUrl;
}
}
function displayStatusMsg() {
status=bannerADlink[adNum];
document.returnValue = true;
}
//-->
</script>
<table border="0" cellspacing="6" cellpadding="1">
<tr>
<td bgcolor="#FFFFFF"><A onmouseover="displayStatusMsg();return document.returnValue" href="javascript:jump2url()"><IMG style="FILTER: revealTrans(ration=2,transition=20)" height=200 src="/img/200306301.jpg" width=150 border=0 name=bannerADrotator></A>
<SCRIPT language=JavaScript>nextAd()</SCRIPT></td>
</tr>
</table>
热心网友
用WAS软件制作
