龙都娱乐»JavaScript»使用 Toolbar.js 实现超酷的 Tooltip 风格工具栏

使用 Toolbar.js 实现超酷的 Tooltip 风格工具栏

来源:Web龙都娱乐 发布时间:2013-03-02 阅读次数:
  Toolbar.js 是一款帮助你快速创建 Tooltip 风格工具栏的 jQuery 插件,可以用于网站或者 Web 应用。工具栏的风格可以使用 Twitter Bootstrap 的图标轻松定制,还提供了灵活的工具栏展示位置和图标数量配置。 官方网站    插件下载

  主要特色:

  1. 简单的实现,简单的参数设置;
  2. 根据需要,可以运行尽可能多的工具栏;
  3. 工具栏可以连接到所需的任何元素;
  4. 工具栏的图标能够通过流行的 Twitter Bootstrap 框架定制;
  5. 工具栏能够响应元素的尺寸变化。

  使用方法:

  引入 JavaScript 文件: <script src="jquery.min.js"></script> <script src="jquery.toolbar.js"></script>   引入 CSS 文件: <link href="jquery.toolbar.css" rel="stylesheet" /> <link href="bootstrap.icons.css" rel="stylesheet" />   定义工具栏 HTML: <div id="user-toolbar-options"> <a href="http://cgxoncampus.com/quot;#"><" class="icon-user"></i></a> <a href="http://cgxoncampus.com/quot;#"><" class="icon-star"></i></a> <a href="http://cgxoncampus.com/quot;#"><" class="icon-edit"></i></a> <a href="http://cgxoncampus.com/quot;#"><" class="icon-delete"></i></a> <a href="http://cgxoncampus.com/quot;#"><" class="icon-ban"></i></a> </div>   设置工具栏参数: $('#user-toolbar').toolbar({ content: '#user-toolbar-options', position: 'top' });
QQ群: WEB龙都娱乐官方总群(83010142) 加群密码:关注下方微信公众号,发送消息 mm 获取
提示:更多精彩内容关注微信公众号:全栈龙都娱乐中心(fsder-com)
网友评论(共2条评论) 正在载入评论......
理智评论文明上网,拒绝恶意谩骂 发表评论 / 共2条评论
登录会员中心
龙都娱乐