jQuery BreakingNews 间歇滚动
BreakingNews 是一款基于jQuery的间歇滚动插件。它可以设置标题、标题颜色、标题背景颜色、链接颜色、字体大小、边框、宽度、自动滚动、间歇时间等等,同时它还好提供两种过度方式——淡入淡出(fade)和向上滑动(slide)。
在线实例
使用方法
<div class="BreakingNewsController easing" id="breakingnews1">
<div class="bn-title"></div>
<ul>
<li><a href="#">强大实用的jQuery幻灯片插件Owl Carousel</a></li>
<li><a href="#">slick制作17173 ChainJoy幻灯片</a></li>
.......
</ul>
<div class="bn-arrows"><span class="bn-arrows-left"></span><span class="bn-arrows-right"></span></div>
</div>
$('#breakingnews1').BreakingNews({
title: '公告'
});
参数详解
参数 | 描述 | 默认值 |
background | 背景颜色 | #FFF |
title | 标题文本 | NEWS |
titlecolor | 标题字体颜色 | #FFF |
titlebgcolor | 标题背景颜色 | #5aa628 |
linkcolor | 链接颜色 | #333 |
linkhovercolor | 链接 hover 颜色值 | #5aa628 |
fonttextsize | 字体大小,单位默认为 px,如果要使用其他单位,请用字符串,如 ’16pt’ | 16 |
isbold | 粗体 | false |
border | 边框,例如 ‘1px solid #099′ | none |
width | 宽度 | 100% |
autoplay | 自动播放 | true |
timer | 滚动间隔,以毫秒为单位 | 3000 |
effect | 动画过度方式,可选 fafde(淡入淡出)或 slide(向上滑动) | fade |
jQuery BreakingNews 间歇滚动的更多相关文章
- jquery无缝间歇向上滚动(间断滚动)
jquery无缝间歇向上滚动 JS部份 $(function(){ var $this = $(".renav"); var scrollTimer; $this.hover(fu ...
- 精心挑选10款优秀的 jQuery 图片左右滚动插件
在现代的网页设计中,图片和内容滑块是一种极为常见和重要的元素.你可以从头开始编写自己的滑动效果,但是这将浪费很多时间,因为网络上已经有众多的优秀的 jQuery 滑块插件.当然,如果要从大量的 jQu ...
- 【jQuery】scroll 滚动到顶部
Jquery 实现页面滚动到顶端 $(document).ready(function () { // 滚动窗口来判断按钮显示或隐藏 $(window).scroll(function () { // ...
- Infinite Scroll - jQuery & WP 无限滚动插件
无限滚动(Infinite Scroll)也称为自动分页.滚动分页和无限分页.常用在图片.文章或其它列表形式的网页中,用来在滚动网页的时候自动加载下一页的内容.Infinite Scroll 这款 ...
- jQuery图片无缝滚动JS代码ul/li结构
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery文字左右滚动
实现jquery文字左右滚动 <div class="fl">中奖名单:</div> <div class="scrollText" ...
- jQuery图片无缝滚动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery.hhLRSlider 左右滚动图片插件
/** * jQuery.hhLRSlider 左右滚动图片插件 * User: huanhuan * QQ: 651471385 * Email: th.wanghuan@gmail.com ...
- jquery图片无缝滚动代码左右 上下无缝滚动图片
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- 初了解NodeJS
发现了NodeJS以后让我有一种很激动的心情,因为它能做我以前一直想写的东西,而如果没有NodeJS我还需要去学习别的语言,但是有了NodeJS以后就可以通过Javascript来写我的程序了,不得不 ...
- 【WPF】制作自定义的列表项面板
我们在使用像ListBox的列表控件时,我们都知道可以通过其ItemsPanel的依赖项属性来自定义一个面板来放置列表控件中的列表项.除了CLR库提供的几个面板外,我们完全可以把自己写的面板作为项列表 ...
- 最先进的开源游戏引擎KlayGE 4.4发布
转载请注明出处为KlayGE游戏引擎,本文的永久链接为http://www.klayge.org/?p=2785 随着半年一个新版本的周期,今天KlayGE 4.4正式发布了!在这个版本的开发中,多名 ...
- CentOS6.5使用createrepo搭建本地源
本地搭建本地yum源采用的rpm全部来自CentOS-6.5-bin-DVD1&DVD2; 我的是在虚拟机环境安装,先检查我的操作系统版本: 1 2 3 4 [adam@ultraera ~] ...
- 邻接矩阵有向图(二)之 C++详解
本章是通过C++实现邻接矩阵有向图. 目录 1. 邻接矩阵有向图的介绍 2. 邻接矩阵有向图的代码说明 3. 邻接矩阵有向图的完整源码 转载请注明出处:http://www.cnblogs.com/s ...
- MongoDB的学习--explain()和hint()
Explain 从之前的文章中,我们可以知道explain()能够提供大量与查询相关的信息.对于速度比较慢的查询来说,这是最重要的诊断工具之一.通过查看一个查询的explain()输出信息,可以知道查 ...
- 关于Unicode和URL encoding入门的一切以及注意事项
本文同时也发表在我另一篇独立博客 <关于Unicode和URL encoding入门的一切以及注意事项>(管理员请注意!这两个都是我自己的原创博客!不要踢出首页!不是转载!已经误会三次了! ...
- 【Android】Android Studio 快速打开Github上的Demo
******* 注意 ******* Google 在15年12月2日发布了Android Studio 2.0,比起以前的版本速度提升了很多,所以强烈推荐各位朋友升级IDE! 1.修改:build. ...
- 【C#公共帮助类】 Utils最全的系统帮助类
最近闲的没事做,自己想着做一些东西,不知不觉居然在博客园找到了这么多公共类,感觉还是挺有用的,平时自己还是用到了好多,就是缺少整理,现在为大家分享一下一个Utils系统帮助类,可能有些现在有新的技术替 ...
- QQ JS_SDk相关功能接口
一.实现QQ登录功能 <!DOCTYPE html><html lang="zh-cn"> <head> <meta htt ...