用户名:

密码:

验证码:

2014年
当前位置:首页 > 生活百科 > 网友说说 >

网站幻灯片怎么制作,网站图片轮播如何做图文教程

2016-09-17 12:40 合德网 点击次数 :

对于大多数网站来说,都或多或少存在网站幻灯片和网站图片轮播功能,很多企业网站都会放在自己做的网站的导航下面,使用几张图片轮流展播。有那种在固定的图片区域 可以自动的更换图片 下面还写着 1.2.3.4.5 那样的数字,在网页图片轮播代码放在三四张图,它实现自动轮播,也可以鼠标点击右下角图片号码就自动展播。效果如下:

网站幻灯片效果展示

对于自己做网站时如何实现这种网站图片轮播效果呢?步骤如下:

  • 第一步:将幻灯片swf与js二个文件到主题文件夹中;
  • 第二步:制作要显示的图片到主题文件夹中的images中。名字只能为1。2。3。4。jpg;
  • 第三步:将以下两句放标签里面,并需要补充绝对的路径第四步:以下一句放要放幻灯片的地方,需要补充完整路径;

    <SCRIPT language=JavaScript src=”/js/comm.js” type=text/javascript></SCRIPT><SCRIPT language=JavaScript src=”/js/swf.js” type=text/javascript></SCRIPT>

  • 第四步:以下一句放要放幻灯片的地方,需要补充完整路径;

    <SCRIPT src=’/js/config.inc.js’ type=text/javascript></SCRIPT>

  • 第五步:修改js 文件夹中的config.inc.js文件里面的图片路径地址和图片的宽度高度。JS里的路径必须填写完整。

    (function($){
    var imag=[];
    var link=[];
    var text=[];imag[0]=encodeURIComponent(“”);
    link[0]=encodeURIComponent(“”);
    text[0]=”学做网站论坛”;
    imag[1]=encodeURIComponent(“”);
    link[1]=encodeURIComponent(“”);
    text[1]=”学做网站论坛”;
    imag[2]=encodeURIComponent(“”);
    link[2]=encodeURIComponent(“”);
    text[2]=”学做网站论坛”;
    imag[3]=encodeURIComponent(“”);
    link[3]=encodeURIComponent(“”);
    text[3]=”学做网站论坛”;
    if(imag.length < 4){
    for(var i=imag.length;i<4;i++){
    imag[i]=””;
    link[i]=encodeURIComponent(“/”);
    text[i]=”学做网站论坛”;
    }
    }
    var pic_width=960;
    var pic_height=240;
    var stop_time=6000;
    makeSWF(‘FrontPageFocusShower’,’’,{
    FlashVars : ‘pics=’+imag.join(‘|’)+’&links=’+link.join(‘|’)+’&texts=’+text.join(‘|’)+’&stop_time=’+stop_time+”,
    wmode: ‘opaque’,
    scale: ‘noScale’,
    quality: ‘high’,
    width : pic_width,
    height : pic_height
    });
    })($);

  • 网站幻灯片制作需用的文件和代码下载: 密码: 977y

    (责任编辑:管理员)
    文章人气:
    (请您在发表言论时自觉遵守互联网相关政策法律法规,文明上网,健康言论。)
    用户名:
    验证码:
    • Dedecms开源内容管理
      Dedecms(织梦)开源内容管理系统软件正式版下载 v5.7 SP1: Dedecms(织梦)是一款国内较...
      Dedecms开源内容管理系统软件
    • 织梦企业模板-DEDEcms
      精品织梦企业模板-DEDEcms复古茶道文化模板-茶叶企业网站模板 代码清晰简单对SEO非常...
      织梦企业模板-DEDEcms复古网站模板-茶叶网站模板
    • dedecms织梦联动筛选[
      调用说明 在需要显示筛选的地方加入 {dede:php}AddFilter(模型ID,类型,字段1);{/dede:...
      dedecms织梦联动筛选[单选版](2)
    • 【升级版】化繁为简
      淘宝客模板介绍 这套织梦淘宝客模板单篇文章内可发布多个淘宝客商品。但是发布流程更...
      【升级版】化繁为简 经典博客型织梦淘宝客模板 高转化率导购网站模板
    首页 | 新闻 | 财经 | 军事 | 百科 | 科技 | 数码 | 汽车 | 游戏 | 娱乐 | 体育 | 文化 | 教育 | 房产 | 旅游 | 健康 | 女性 | 明星 | 美女