zoukankan      html  css  js  c++  java
  • 一个超棒的jQuery通知栏插件 jBar

    日期:2012-10-24  来源:GBin1.com

    一个超棒的jQuery通知栏插件 - jBar

    在线演示  本地下载

    以前我们分享过一款基于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实现。希望大家喜欢,如果有任何问题,请给我们留言!

    来源:一个超棒的jQuery通知栏插件 - jBar

    欢迎访问GBin1.com
  • 相关阅读:
    Codeforces Round #366 (Div. 2)
    Codeforces Round #367 (Div. 2)
    带权并查集小练
    Codeforces Round #368 (Div. 2)
    Codeforces Round #396 (Div. 2)
    Codeforces Round #376 (Div. 2)
    工作流
    程序员之江湖感想
    工作流设计简介
    程序员常去的103个网站
  • 原文地址:https://www.cnblogs.com/gbin1/p/2738586.html
Copyright © 2011-2022 走看看