基于bootstrap3响应式Tooltip提示插件

图中的提示框就是效果

因本主题有接入Tooltip,只需调用即可,没有再接入此插件。

ggtooltip.js是一款非常实用的基于bootstrap 3.X的jQuery tooltip提示插件。该bootstrap jQuery tooltip插件实用简单,支持在4个方向上像素tooltip信息,支持修改tooltip的背景色、前景色和边框颜色。
该jQuery tooltip插件实用简单,支持在4个方向上像素tooltip信息,支持修改tooltip的背景色、前景色和边框颜色。它的特点有:

支持4个上下左右4个方向显示tooltip。

不限制背景颜色。

不限制字体颜色。

可以自由设置tooltip的边框颜色。

支持各种触发tooltip的事件,如:click、hover、focus 或手动触发。

基于HTML5、CSS3和jQuery制作。

调用方式:

引入ggtooltip.css和ggtooltip.js文件以及依赖文件。

<link href=”css/ggtooltip.css” rel=”stylesheet” /><!–必要CSS–>

<script src=”js/jquery-2.1.3.min.js”></script>

<script src=”js/ggtooltip.js”></script>

<script type=”text/javascript”>
$(document).ready(function () {
$(‘.gg-examples1 button’).ggtooltip();
$(‘.gg-examples2 a’).ggtooltip();
});
</script>

在公共块div中引入类名:gg-examples2

链接引入【两种方式】

<button type=”button” class=”btn btn-default” data-placement=”top” title=”Tooltip on top”>顶部的工具提示</button>

<a href=”https://www.xxx.com/” data-placement=”top” title=”立即访问”>查看详情</a>

    下载权限

    查看
    • 免费下载
      评论并刷新后下载
      登录后下载

    查看演示

    • {{attr.name}}:
    您当前的等级为
    登录后免费下载登录 小黑屋反思中,不准下载! 评论后刷新页面下载评论 支付以后下载 请先登录 您今天的下载次数(次)用完了,请明天再来 支付积分以后下载立即支付 支付以后下载立即支付 您当前的用户组不允许下载升级会员
    您已获得下载权限 您可以每天下载资源次,今日剩余

    给TA充电
    共{{data.count}}人
    人已充电
    壁纸默认

    白色猫的美女江亦祺手机壁纸

    2022-2-5 20:47:17

    默认

    wordpress限制某地区访问站点

    2022-2-10 15:39:00



    声明 一、本站上的部份代码及教程来源于互联网,仅供网友学习交流。如有侵权,无意侵害您的权益,请发送邮件至xutian#ahap.cn或点击右侧 联系我们,我们将尽快处理。
    二、请勿将购买的资源教程转载或分享与他人!


    2 条回复 A文章作者 M管理员
    1. 未名游客给您打赏了¥10
    2. 许天

      ❤️

    个人中心
    购物车
    优惠劵
    今日签到
    有新私信 私信列表
    有新消息 消息中心
    搜索