zoukankan      html  css  js  c++  java
  • flash下的图片轮播

    实现图片轮播的方式有很多种,有直接HTML的,有JS的,还有FLASH的。

    我比较喜欢FLASH的,因为它比较好的实现了功能的封装,只需要在界面上放一个<embed>标签就能解决问题。

    我在这里介绍的是一款国人开发的Flash轮播插件:bcastr,其最新版本是4.0bate,全部配置由xml实现。

    首先在目录下建一个文件夹,放置你准备轮播的图片:image

    然后开始写Xml配置文件:文件名为:bcastr.xml


    代码
     <?xml version="1.0" encoding="utf-8"?>  
     
    <data>  
         
    <channel>  
             
    <item>  
                 
    <link>http://www.ruochi.com</link>  
                 
    <image>images/image1.jpg</image>  
                 
    <title>Bell Tower,Xi'an,China</title>  
             
    </item>  
             
    <item>  
                 
    <link>http://www.ruochigroup.com</link>  
                 
    <image>images/image2.jpg</image>  
                 
    <title>Greater Wild Goose Pagoda,Xi'an,China</title>  
             
    </item>  
             
    <item>  
                 
    <link>http://www.ruochi.com</link>  
                 
    <image>images/image3.jpg</image>  
                 
    <title>Terra Cotta Warriors,Xi'an,China</title>  
             
    </item>  
             
    <item>  
                 
    <link>http://www.ruochigroup.com</link>  
                 
    <image>images/image4.jpg</image>  
                 
    <title>The Forest of Steles ,Xi'an,China</title>  
             
    </item>  
             
    <item>  
                 
    <link>http://www.ruochi.com</link>  
                 
    <image>images/image5.jpg</image>  
                 
    <title>The Qian Tomb,Xi'an,China</title>  
             
    </item>  
         
    </channel>  
         
    <config>    
             
    <roundCorner>0</roundCorner>  
             
    <autoPlayTime>8</autoPlayTime>  
             
    <isHeightQuality>false</isHeightQuality>  
             
    <blendMode>normal</blendMode>  
             
    <transDuration>1</transDuration>  
             
    <windowOpen>_self</windowOpen>  
             
    <btnSetMargin>auto 5 5 auto</btnSetMargin>  
             
    <btnDistance>20</btnDistance>  
             
    <titleBgColor>0xff6600</titleBgColor>  
             
    <titleTextColor>0xffffff</titleTextColor>  
             
    <titleBgAlpha>.75</titleBgAlpha>  
             
    <titleMoveDuration>1</titleMoveDuration>  
             
    <btnAlpha>.7</btnAlpha>   
             
    <btnTextColor>0xffffff</btnTextColor>     
             
    <btnDefaultColor>0x1B3433</btnDefaultColor>  
             
    <btnHoverColor>0xff9900</btnHoverColor>  
             
    <btnFocusColor>0xff6600</btnFocusColor>  
             
    <changImageMode>click</changImageMode>  
             
    <isShowBtn>true</isShowBtn>  
             
    <isShowTitle>true</isShowTitle>  
             
    <scaleMode>noBorder</scaleMode>  
             
    <transform>blur</transform>  
             
    <isShowAbout>true</isShowAbout>  
             
    <titleFont>微软雅黑</titleFont>  
         
    </config>  
     
    </data> 

    以上各种配置用处请参见帮助文档。

    最后只需要在HTML中插入bcastr4.swf,它便会自动录找配置文件并读出配置了


    <embed src="bcastr4.swf"></embed>

    下载:bcastr4

    http://ljzforever.qupan.com/?folder=950894 

    考参的文章:

    Bcastr 4.0 Beta - flash image silde show 图片轮换播放 (开源 Open Source)

    http://www.ruochi.com/main/2008/03/19/bcastr-40/


  • 相关阅读:
    Odoo search 搜索视图详解与搜索视图工作原理
    Odoo treeView列表视图详解
    Odoo视图的共有标签
    Odoo中的字段显示方式和行为控制
    Odoo中的env详解
    Odoo中报表PDF样式出错的解决办法
    odoo Botton标签属性详解
    Odoo甘特图
    Odoo field字段标签属性详解
    Odoo form视图详解
  • 原文地址:https://www.cnblogs.com/ljzforever/p/1681479.html
Copyright © 2011-2022 走看看