CMS用通用图片轮换flash幻灯片播放器:Bcastr3和Bcastr4
这款Bcastr通用图片轮换播放器(或者叫他幻灯片播放器),由于其简洁的代码及其易用性,被dedeCMS、PHPCMS、帝国CMS、Z-blog等诸多网站内容管理程序开发者广泛引用。被使用的最多的是bcastr3,而开源的bcastr4不知何故没有推广开来。今天特地搜罗到了,bcastr3及bcastr4的源码和实例下载,同时分享一下他们的使用技巧。
用dedeCMS的朋友都知道dedeCMS的幻灯片展示是bcastr3.swf,之前小车也写过关于dedeCMS幻灯片的各种灵活的调用方法 其中的内容就是关于bcastr3.0的一些使用技巧。通过google我了解到,这个Bcastr flash 实际上是Ruochi Group开发的开源的通用图片轮换播放器,一直到发稿前为止,Ruochi Group的网站始终无法访问,我也无从考证,但是万能的google还是让我找到了他们。
bcastr3的使用方法及参数设置
bcastr3通用图片轮换播放器,可以用于各种新闻系统或者blog系统。它有以下几大功能:
.可以读取xml设置播放列表,自定义xml地址
.可以将图片地址直接写网页中直接,不需要xml
.自动适应图片大小
.循环播放,自定义自动播放时间
.不限制图片数量
.自定义尺寸,自动适应任何比例,图片不变形
.自定义图片题目(可选)
.浏览过程中下载
.自定义图片连接(可选)
.自定界面色彩放案
它的使用方法及代码有三种:
特别说明:由于flashplayer9 升级了安全策略问题,所以需要保证所有的的文件(包括,bcastr3.swf,图片文件,或者需要的xml文件)都必须在统一域名下,不能在跨域读取图片和xml了
方法一,直接copy下面代码,修改其中的 swf_width,swf_height,files,links,texts 参数
程序代码:
<script type=”text/javascript”>
// <![CDATA[
var swf_width=220
var swf_height=220
var files=’pic/gymnasium.jpg|pic/zd.jpg|pic/adidas.jpg’
var links=’http://blog.bashanren.com|http://blog.bashanren.com|http://blog.bashanren.com’document.write(‘<embed src=”bcastr3/bcastr3.swf” wmode=”opaque” FlashVars=”bcastr_file=’+files+’&bcastr_link=’+links+’&bcastr_title=’+texts+’& menu=”false” quality=”high” width=”‘+ swf_width +'” height=”‘+ swf_height +'” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” />’);
// ]]></script>
方法二,直接嵌入地址
程序代码:
<embed src=”bcastr3/bcastr3.swf” FlashVars=”bcastr_file=aaa.jpg|bbb.jpg|ccc.swf&bcastr_link=http://www.baidu.com|http://www.nba.com|http://www.ruochi.com&bcastr_title=百度|NBA|Ruochi.com” width=”400″ height=”200″ loop=”false” quality=”high” pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” salign=”T” name=”scriptmain” menu=”false” wmode=”transparent”></embed>
其中
bcastr_file=aaa.jpg|bbb.jpg|ccc.swf 是图片地址,用”|”符号分开
bcastr_link=http://www.baidu.com|http://www.nba.com|http://www.ruochi.com 是图片对应连接地址,用”|”符号分开
bcastr_title=百度|NBA|Ruochi.com 是图片对应标题,用”|”符号分开
注意其中的&连接符
方法三,使用xml地址
程序代码
<embed width=”100″ height=”200″ type=”application/x-shockwave-flash” src=”bcastr3/bcastr3.swf” quality=”high” wmode=”transparent” FlashVars=”bcastr_xml_url=bcastr3/bcastr.xml” pluginspage=”http://www.macromedia.com/go/getflashplayer” />
修改上方的bcastr_xml_url=bcastr3/bcastr.xml地址即可
xml内容
item_url=”pic/Maradona.jpg” 图片地址
link=”http://www.google.com” 图片点击后 不填写就不可点击连接
itemtitle=”马拉多纳受邀解说世界杯” 图片题目
高级设置
程序代码:
<embed src=”bcastr3/bcastr3.swf” FlashVars=”bcastr_file=a1.jpg|a2.jpg|a3.jpg&bcastr_link=http://www.google.com|http://www.baidu.com|http://www.google.com&bcastr_title=Title 1|Title 2|Title 3&TitleTextColor=0x000000&TitleBgColor=0x0066ff” width=”400″ height=”200″ loop=”false” quality=”high” pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” salign=”T” name=”scriptmain” menu=”false” wmode=”transparent”></embed>
这段代码里设置了标题颜色和标题背景颜色。
程序代码
<embed src=”bcastr3/bcastr3.swf” FlashVars=”bcastr_file=a1.jpg|a2.jpg|a3.jpg&bcastr_link=http://www.google.com|http://www.baidu.com|http://www.google.com&bcastr_title=&IsShowBtn=0″ width=”400″ height=”80″ loop=”false” quality=”high” pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” salign=”T” name=”scriptmain” menu=”false” wmode=”transparent”></embed>
这里设置的是不显示标题和按钮。
所有参数说明
参数名称<>参数说明<>默认值
bcastr_file<>图片地址参数,多个使用|分开,与方法2配合使用<>空
bcastr_title<>图片标题参数,多个使用|分开,与方法2配合使用<>空
bcastr_link<>图片连接参数,多个使用|分开,与方法2配合使用<>空
bcastr_xml<>方法3 传递图片参数,样板参考http://www.ruochi.com/product/bcastr3/bcastr.xml<>bcastr.xml
TitleTextColor<>图片名称文字颜色<>0xFFFFFF
TitleBgColor<>图片名称文字背景颜色<>0xFF6600
TitleBgAlpha<>图片名称文字背景颜色透明度:0-100值,0表示全部透明<>60
TitleBgPosition<>图片名称文字位置,0表示文字在顶端,1表示文字在底部,2表示文字在顶端浮动<>100
BtnDefaultColor<>按键默认的颜色<>0xFF6600
BtnOverColor<>按键当前的颜色<>0x000033
AutoPlayTime<>自动播放时间:单位是秒<>8
Tween<>图片过渡效果:0,表示亮度过渡,1表示透明度过渡,2表示模糊过渡,3表示运动模糊过渡<>2
IsShowBtn<>是否显示按钮:1表示显示按键,0表示隐藏按键,更适合做广告挑轮换<>1
WinOpen<>打开窗口:_blank表示新窗口打开。_self表示在当前窗口打开.
以上是bcastr3,我们再看一下bcastr4:
bcastr4的使用方法及参数设置
Bcastr4在2008年6月9日被放出,Bcastr 4flash image silde show 图片轮换播放 (开源 Open Source),作者还放出了AS3.0的源码。
新的Bcastr增加的特点如下:
- 使用as3.0重写,效率有所提高
- 增加了几种变换方式
- 新参数和bcastr3.x不同,xml格式采用rss2.0的格式,可以直接读取rss中的图片(不能跨域)
- 可以通过xml对播放器设置
- 等多参数可以设置
代码使用方法有两种:
方法一,直接写入图片及相关参数
<embed src=”images/bcastr4.swf” wmode=”Transparent” FlashVars=”xml=
<data>
<channel>
<item>
<link>http://www.baidu.com/</link>
<image>uploads/1.jpg</image>
<title>图片1</title>
</item>
<item>
<link>http://www.baidu.com/</link>
<image>uploads/2.jpg</image>
<title>图片2</title>
</item>
<item>
<link>http://www.baidu.com/</link>
<image>uploads/3.jpg</image>
<title>图片2</title>
</item>
</channel>
<config>
<autoPlayTime>3</autoPlayTime>
<btnDefaultColor>#83b4d8</btnDefaultColor>
<isShowAbout>false</isShowAbout>
<titleBgColor>0x333333</titleBgColor>
<TitleBgPosition>1</TitleBgPosition>
<titleFont></titleFont>
<titleBgAlpha>.50</titleBgAlpha>
<titleMoveDuration>1</titleMoveDuration>
</config>
</data>” quality=”high” width=”230″ height=”160″ type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” />
此种写法适合在CMS中使用,方便调用。参数意义详见下方使用说明。
方法二,使用xml文件读取图片及参数
使用xml时写入一下代码:
<embed width=”100″ height=”200″ type=”application/x-shockwave-flash” src=”flash/bcastr4.swf” quality=”high” wmode=”transparent” FlashVars=”bcastr_xml_url=flash/bcastr.xml” pluginspage=”http://www.macromedia.com/go/getflashplayer” />
参数设置说明:xml的可以设置的全部参数,以及默认的数值
<data>
<channel>
<item>
<link>http://www.baidu.com/</link>
<image>images/Desert.jpg</image>
<title>沙漠</title>
</item>
<item>
<link>http://www.baidu.com/</link>
<image>images/Hydrangeas.jpg</image>
<title>八仙花</title>
</item>
<item>
<link>http://www.baidu.com/</link>
<image>images/Jellyfish.jpg</image>
<title>水母</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”
改版后的Bcastr4——移动图片标题位置的位置到下方
Bcastr4虽然效果更好且更易用,但是图片标题的位置却被固定到了图片顶部,无法移动。于是,有达人自行修改了源码,将图片标题的位置由顶部移动到了底部。
Bcastr3/Bcastr4/改版Bcastr4下载
- 点击下载:通用图片轮换FLASH播放器Bcastr3
- 点击下载:通用图片轮换FLASH播放器Bcastr4(带源文件)
- 点击下载:通用图片轮换FLASH播放器Bcastr4标题下置版
- 点击下载:通用图片轮换FLASH播放器Bcastr3/Bcastr4/Bcastr4标题下置版整合包
CMS用通用图片轮换flash幻灯片播放器:Bcastr3和Bcastr4相关推荐
- 转:享受 Bcastr 4.0,优秀的通用图片轮换播放器~~
特别提示:xml 是可以动态生成的,但是在生成的时候要着重考虑 bcastr4.swf .bcastr.xml 以及 图片的路径关系,另外需要注意 flash新版本 是不能跨域的,flash里面的链接 ...
- CMP FLASH影音播放器插件
我搜索视频播放插件很久了,一直没有找到合适的(要么功能不完善.要么有水印.要么界面不美观),今天终于找到了一个不错的视频播放插件--CMP4 Flash 影音播放器插件. CMP是一款免费的在线Fla ...
- jw player flash网页播放器 参数说明以及应用配置
jw player flash网页播放器 参数说明以及应用配置 1.参数解释 这些参数可以配置被嵌入到html中的播放器的行为和外观.如果使用swfobject.js,可以用addVariable() ...
- 如何将embed嵌入式Flash网页播放器替换为CKplayer
工作中,经常遇到CMS里内嵌的使用embed标签的Flash网页播放器,这些播放器交互性差.不好用,但是因为embed标签往往已通过富文本编辑器写入了数据库的内容字段,很难去改写.如何在不改变数据库的 ...
- flash音乐播放器 制作教程
flash音乐播放器 制作教程 2011年09月24日 [b]请下载最新CMP v2.1正式版:[/b] [b]http://linsu.sz17399.com/cmp21/cmp21.rar[/b] ...
- 如何用VB编写FLASH动画播放器
用VB编写FLASH动画播放器 Flash4是MacroMedia公司出品的矢量动画创作专业软件,利用该软件制作的矢量动画具有文件体积小.带音效和兼容性好等特点.那么,你想不 ...
- android swf 播放器代码,Android Flash swf播放器源码(2016),技术稳定可以商用—— BY softboy...
Android Flash swf播放器源码(2016) 为什么说标题加上2016? 其实不是什么新技术,因为android4.1之后的android 浏览器内核版本发生了变化导致 Adobe 的Fl ...
- android swf 播放器代码,Android Flash swf播放器源码(2019)
Android Flash swf播放器源码(2019) 为什么说标题加上2019? 其实不是什么新技术,因为android4.1之后的android 浏览器内核版本发生了变化导致 Adobe 的Fl ...
- Chrome 出现“您未安装Flash Player播放器或者版本过低”问题
Chrome 出现"您未安装Flash Player播放器或者版本过低"问题 方法: 1.在Chrome地址栏输入chrome://components 2.看到谷歌浏览器所有已安 ...
最新文章
- 任正非说到做到:华为正与美企谈判,授权转让5G技术
- WCF的三个名称/命名空间,你是否傻傻分不清楚?
- 电子自动窗帘系统c语言程序,单片机自动窗帘控制程序(两个电机)
- 中柏平板触摸驱动_工业平板电脑触摸屏种类及故障解决办法,赶紧收藏起来
- Android中利用ant进行多渠道循环批量打包(一)
- 【英文写作日知录 第2期】句式汇总 Sun, 04 July 2021
- 升级华为鸿蒙os2.0名单,鸿蒙OS 2.0正式版升级名单确认!这10款机型用户先恭喜了...
- Mac硬盘格式转化好帮手——Tuxera NTFS
- Vue3+ts+vite 国际化处理
- 肯耐珂萨java_站在尤里奇的肩膀上,肯耐珂萨探讨适用于国内的HR胜任力模型
- 5G牌照今日发放!!!
- Java基础(二)public、private、protected修饰的方法
- MongoDB查询命令详解
- 06-课堂笔记-包相关
- java mysql点赞功能_用Java做一个类似于微博QQ空间点赞的功能-Fun言
- kali密码破解工具
- 记一次JAVA中字符串首字母大写转化为小写的Code
- 《k3s 源码解析4 ---- k3s重要数据结构》
- 地震信号-相关子波零相位化
- 设计模式—简单工厂模式
热门文章
- 面试必备技能,springsecurity
- 高中选科学计算机可以不学物理吗,新高考为什么特别重视物理学科,高中生要不要选物理科目?...
- 【剑指offer】登峰造极 -- 树的子结构
- hadoop入门1:ERROR Cannot set priority of datanode process
- 关于召开2023海洋生物资源开发利用与现代生物智能制造论坛的通知
- 凡科的ns服务器如何修改,ns怎么把服务器设置成日服
- 水果超市-用JavaWeb写的新手练手项目
- 智能慧工厂虚拟仿真管理系统软件
- java中update怎么写,update语句
- 用web用户控件的方式添加到webpart,使用ajax实现无刷新总结