码迷,mamicode.com
首页 > 其他好文 > 详细

EasyUI - Tooltip 提示控件

时间:2015-10-10 00:25:25      阅读:288      评论:0      收藏:0      [点我收藏+]

标签:

第一种:

效果:

技术分享

 

html代码:

  • 不需要js代码,显示的是title中的内容。
<div>
    <a href="#" title="This is the tooltip message." class="easyui-tooltip">Hover me 01</a>
</div>

 

 

 

第二种:

效果:

技术分享

 

html代码:

<div>
    <a id="dd" href="javascript:void(0)" >Hover here 02</a>
</div>

 

JS代码:

  • position string 消息框位置。可用值有:"left","right","top","bottom" bottom 。
  • content string 消息框内容。 
  • onShow e 在显示提示框的时候触发。 
$(function () {
    $(#dd).tooltip({
        position: right,
        content: <span style="color:#fff">This is the tooltip message.</span>,
        onShow: function () {
            $(this).tooltip(tip).css({
                backgroundColor: #666, borderColor: #666
            });
        }
    });
})

 

EasyUI - Tooltip 提示控件

标签:

原文地址:http://www.cnblogs.com/KTblog/p/4865536.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!