Search

与我们合作

我们专注:网站策划设计、网络多媒体传播、网站优化及网站营销、品牌策略与设计
主营业务:网站建设、移动端微信小程序开发、VI设计、网络运营、云产品·运维解决方案

有一个品牌项目想和我们谈谈吗?

您可以填写右边的表格,让我们了解您的项目需求,这是一个良好的开始,我们将会尽快与您取得联系。当然也欢迎您给我们写信或是打电话,让我们听到您的声音

您也可通过下列途径与我们取得联系:

地 址: 深圳.龙岗区大运软件小镇11栋3楼

电 话: 138 2888 4598 / 138 0880 9053

网 址: http://www.appvx.cn

快速提交您的需求 ↓

jquery模拟title提示效果

时间:2017-07-05 浏览:3711 编辑:SW 来源:技术博客

当文字字符长度被限制后,总有些长标题会被截断,用title提示虽简单但会造成页面html代码的冗余,这里用jquery做了一个模拟title的提示效果,具体代码如下:

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>jQuery实现的简单文字提示效果</title>

<script src="http://www.phpernote.com/js/jquery.min.js" type="text/javascript"></script>

<style type="text/css">

#pt_phpernote{

position:absolute;

border:1px solid #333;

background:#f7f5d1;

padding:2px;

color:#333;

display:none;

font-size:12px;

}

</style>

<script type="text/javascript">

$(function(){

    var x=10,y=20;

    $("a.pt").mouseover(function(e){

        $("body").append("<div id='pt_phpernote'>"+ this.text+"<\/div>");

        $("#pt_phpernote").css({"top":(e.pageY+y)+"px","left":(e.pageX+x)+"px"}).show("fast");

    }).mouseout(function(){

        $("#pt_phpernote").remove();

    }).mousemove(function(e){

        $("#pt_phpernote").css({"top":(e.pageY+y)+"px","left":(e.pageX+x)+"px"});

    });

})

</script>

</head>

<body>

<p><a href="#" class="pt">php cli下接受参数的几种方法</a></p>

</body>

</html>



本站文章均为深正网站建设摘自权威资料,书籍,或网络原创文章,如有版权纠纷或者违规问题,请即刻联系我们删除,我们欢迎您分享,引用和转载,但谢绝直接搬砖和抄袭!感谢...
GO 欣赏案例
查看经典案例
在线咨询
电话咨询
0755-36630177
返回顶部
在线咨询 获取报价 电话咨询
获取报价
您的称呼:

*

您的电话:

*

您的邮箱:

*

提交 重置
重要的事情,电话里聊

接通客服

不方便的时候线上咨询,在线等哦