Bcastr4.0Beta-flashimagesildeshow图片轮换播放

更多实例

更新

2008-06-09
  • 使用as3.0重写,效率有所提高
  • 增加了几种变换方式
  • 新参数和bcastr3.x不同,xml格式采用rss2.0的格式,可以直接读取rss中的图片(不能跨域)
  • 可以通过xml对播放器设置
  • 等多参数可以设置

下载

插入代码

直接写入参数
<objecttype=“application/x-shockwave-flash”data=“bcastr4.swf?xml=
<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.ruochi.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.ruochi.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>
</data>
" width="650" height="500">
<param name=”movie” value=”bcastr4.swf?xml=
<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.ruochi.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.ruochi.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>
</data>" />
</object>
使用xml传递参数
<objectid=“bcastr4″data=“bcastr4.swf?xml=http://bcastr.ruochi.com/v4/bcastr.xml”type=“application/x-shockwave-flash”width=“240″height=“180″>
<paramname=“movie”value=“bcastr4.swf?xml=http://bcastr.ruochi.com/v4/bcastr.xml”/>
</object>

参数说明

xml的可以设置的全部参数,以及默认的数值

<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.ruochi.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.ruochi.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>

<titleBgAlpha>.75</titleBgAlpha>
<titleMoveDuration>1</titleMoveDuration>
<btnAlpha>.7</btnAlpha>
<btnDefaultColor>0xB3433</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>
</config>
</data>

以下用”.”描述xml树结构并说明参数作用

影片信息

channel.item

图片信息,可以设置多张图片

channel.itme.image

图片地址参数,此参数是唯一必须要有的参数,其他参数都有默认参数

channel.itme.link

对应图片的连接

channel.itme.tilte

对应图片的标题

设置

config.roundCorner

图片的圆角

config.autoPlayTime

图片切换时间,默认值是8,单位秒

config.isHeightQuality

图片缩小是否采用高质量的方法,默认值false

config.normal

图片的混合模式

config.transDuration

图片在切换过程中的时间,默认值1,单位秒

config.windowOpen

图片连接的打开方式,默认值”_blank”,在新窗口打开,也可以使用”_self”,使用本窗口打开

config.btnSetMargin

按钮的位置,文字的位置,用了css的margin概念,默认值”auto 5 5 auto”,四个数值代表 上 右 下 左 相对于播放器的距离,四个数值用空格分开,不需具体数值用”auto”填写 ,比如左上对齐并都有10像素的距离可以写 “10 auto auto 10″, 右下角对齐是”auto 10 10 auto”

config.btnDistance

每个按钮的距离,默认值20

config.titleBgColor

标题背景的颜色,默认0xff6600

config.titleTextColor

标题文字的颜色,默认0xffffff

config.titleBgAlpha

标题背景的透明度,默认0.75

config.titleFont

标题文字的字体,默认值”微软雅黑”

config.titleMoveDuration

标题背景动画的时间,默认值1,单位秒

config.btnAlpha

按钮的透明度,默认值0.7

config.btnTextColor

按钮文字的颜色,默认值0xffffff

config.btnDefaultColor

按钮的默认颜色,默认值0×1B3433

config.btnHoverColor

按钮的默认颜色,默认值0xff9900

config.btnFocusColor

按钮当前颜色,默认值0xff6600

config.changImageMode

切换图片的方法,默认值”click”,点击切换图片,还可以使用”hover”,鼠标悬停就切换图片

config.isShowBtn

是否显示按钮,默认值”true”

config.isShowTitle

是否显示标题,默认值”true”

config.scaleMode

图片放缩模式: 默认值是”noBorder”
“showAll”: 可以看到全部图片,保持比例,可能上下或者左右
“exactFil”: 放缩图片到舞台的尺寸,可能比例失调
“noScale”: 图片的原始尺寸,无放缩
“noBorder”: 图片充满播放器,保持比例,可能会被裁剪

config.transform

图片放缩模式: 默认值是”alpha”
“alpha”: 透明度淡入淡出
“blur”: 模糊淡入淡出
“left”: 左方图片滚动
“right”: 右方图片滚动
“top”: 上方图片滚动
“bottom”: 下方图片滚动
“breathe”: 有一点点地放缩的淡入淡出
“breatheBlur”: 有一点点地放缩的模糊淡入淡出,本页的例子就是这个

config.isShowAbout

是否显示关于信息,默认值”true”

意见和反馈

你可能感兴趣的:(xml,css,Google,Flash)