Google
 
欢迎使用千一产品
千一产品:BoardExhibition v1.0.1

BoardExhibition 是在原 Exhibition 系列 2 上的全面升级,整合向上、向下、向左、向右滚动四种效果,自动识别消息数量,可以自动准备消息,可直接将常用的 tabel、ul、div 静态列表转变成屏展效果的列表,专门用于站内公告、通知通报、图片展览等宣传展示性内容。

BoardExhibition 是为屏展效果而设计的,但兼容无缝滚动效果。

BoardExhibition 采用 JavaScript 类进行设计,调用只需要两句代码,使用非常方便。

版本更新
  • 修改 类名称。
  • 删除 构造函数中的 objStr 参数。
演示地址

/products/exhibition/BoardExhibition/demo.htm

 
运行环境
  • Internet Explorer 全面支持
  • Firefox 全面支持
程序参考
程序准备

向上向下滚动效果中,滚动内容可以存储在 div 或 table 中。

而向左向右滚动效果中,滚动内容只能存储在 table 中,因为只有 table 的 td 才能保证各条消息位于同一行,其它 span 或 带样式表的 div 都会造成多条消息位于多行,从而无法实现左右滚动效果。

使用哪一种存储方式,直接涉及到参数 msgDepth 值。

程序开始

var objup = new BoardExhibition("msgup", 3, true, "up", 2, 1000);

objup.ShowMsg();

相关函数

BoardExhibition(targetStr, msgDepth, autoClone, direction, msgScrollDelay, msgScreenDelay)

构造函数。

  • targetStr 字符串 要显示消息的 HTML 元素标签的 Id。
  • msgDepth 数字 消息来源,即消息内容与 targetStr 相差几个结点。详细
  • autoClone 布尔 是否自动克隆一份滚动内容,由于需要两份一样的滚动内容才能实现滚动效果,所以此参数决定是否由程序自动克隆其内容。详细
  • direction 字符串 滚动方向,可选值:top、down、left、right。
  • msgScrollDelay 数字 滚动延迟,单位毫秒。
  • msgScreenDelay 数字 屏停时间,单位毫秒。

ShowMsg()

显示消息。

常见问题
  • 是否需要应用样式表 应该为每一条消息明确宽度和高度,向左向右滚动效果时只能用 table 存储数据,并且要为该 table 设置宽度,其宽度设置应该是:消息总数*2*每条消息的宽度。
  • 在 FireFox 里滚动时,为什么消息的实际位置有时会偏上一些? 这是由于 IE 和 FireFox 对边框的解释不同,而你又恰恰对展示区作了边框设定。解决办法是不用边框,或在展示区之外再套一层元素(如 div),对外层元素进行边框设定。
  • 听说兼容无缝滚动,如何实现? 您只需要将参数 msgScrollDelay 和 msgScreenDelay 设置为同一个值即可。
产品下载

当前版本 v1.0.1 点击下载压缩文件包,内含:

  • JS 主程序文件 1 个
  • 示例文件 1 个
  • 技术参考文件 2 个