一个超棒的jQuery通知栏插件 - jBar
日期:2012-10-24 来源:GBin1.com
以前我们分享过一款基于jQuery,backbone的通知类库:Backbone.Notifier,今天我们分享另外一个款超棒的通知插件 - jBar。
jBar是 一款基于jQuery的用户行为调用的通知栏实现,和一般的通知不太一样的地方在于它并不弹出一个窗口或者其它提示,当有新的信息或者消息需要传递给用户 的时候,它会在页面顶端或者底端生成一个工具栏,用户可以选择查看或者稍后查看,整个过程不会打断用户目前的浏览操作,也不会让用户感觉到干扰。
主要特性
- 轻量级的jQuery插件
- 代码容易实现
- 支持自定义,方便的修改CSS
- 并且支持整合jQueryUI
- 支持现代浏览器
如何使用
使用jbar非常简单,你只需要引入jQuery类库和jBar类库,如下:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
<!--[if lt IE 10]><script src="js/html5.js"></script><![endif]-->
javascript代码如下:
$(window).load(function() { // jBar Script by Todd Motto $('.jBar').hide(); $('.jRibbon').show().removeClass('up', 300); $('.jTrigger').click(function(){ $('.jRibbon').toggleClass('up', 300); $('.jBar').slideToggle(); }); });
代码使用非常简单的jQuery实现。希望大家喜欢,如果有任何问题,请给我们留言!
欢迎访问GBin1.com
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架
2011-10-25 GBin1教程:使用jQuery Mobile快速开发一个手机阅读网站
2011-10-25 5个在线Ajax“加载中”旋转图标生成器工具