可停靠屏幕边缘的侧边栏插件

所属分类:其他-独立的部件

 27711  359  查看评论 (15)
分享到微信朋友圈
X
可停靠屏幕边缘的侧边栏插件 ie兼容7

插件图标依赖font-awesome,所以要先导入该字体图标,然后导入相关js文件即可:

<head>
    <link rel="stylesheet" type="text/css" href="css/font-awesome/css/font-awesome.css"/>
    <script src="js/jquery-1.11.3.min.js"></script>
    <script src="js/jquery.sliderBar.js"></script>
</head>


先在页面插入一下html代码(class="sliderbar-container"这个class的值可以随意更改,但是class="title"和class="body",则不能更改)

<div class="sliderbar-container">
    <div class="title"><i></i> 通知消息</div>
    <div class="body">
        无消息
    </div>
</div>

然后插入以下js代码:

<script type="text/javascript">
$(function(){
    $('.sliderbar-container').sliderBar({
         open : true,           // 默认是否打开,true打开,false关闭
        top : 200,             // 距离顶部多高
       width : 360,           // body内容宽度
       height : 240,          // body内容高度
       theme : 'green',       // 主题颜色
       position : 'left'      // 显示位置,有left和right两种
    });
});
</script>

ok,大功告成!


相关插件-独立的部件

js上下文菜单插件basicContext.js

basicContext.js 强大的纯Js上下文菜单插件
  独立的部件
 20449  296

jQuery HTML导出Excel插件table2excel

jquerytable2excel是一款可以将HTML表格的内容导出到微软Excel电子表格中的jQuery插件。该插件可以根据你的需要导出表格中的内容,不需要的行可以不导出。它文件体积小,使用非常方便。
  独立的部件
 98960  418

jquery-ui改良版

jquery-ui或许你都看厌了那些ui,改良后的ui较为现代化
  独立的部件
 32194  268

jQuery漂亮的CSS3颜色渐变选择器

jQuery漂亮的CSS3颜色渐变选择器可直接生成各种CSS渐变代码,功能强大!
  独立的部件
 21322  240

讨论这个项目(15)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    Mi_King 0
    2019/8/30 14:17:50
    这个收的qB有点多啊,不过做的不错 回复
    I Believe I Can Fly 1
    2019/5/9 10:15:41
    解决方式
    obj.css({right: -(opts.width+20)+'px'});
    jquery.sliderBar.js 行 136 回复
    境界 0
    2018/11/4 20:55:45
    position为right的时候有问题(标签离页面有边界有距离),不能自定义标签的高度
        I Believe I Can Fly0
        2019/5/9 9:56:00
    回复
    眼角的幸福13 0
    2017/11/23 12:40:09
    被害人何某 0
    2017/11/23 9:44:18
    hanhaoooo 0
    2017/8/26 20:38:13
        0
    2016/12/21 16:12:24
    Shine 0
    2016/8/12 14:08:22
    感觉不是很好用啊     回复
    Dssy 0
    2016/6/23 16:06:53
    我顶你2个肺 0
    2016/4/12 11:04:22
    积分不够怎么办啊
        iProg-js0
        2016/4/16 10:04:48
        联系我,1440552721
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复