+86-13828884598

jquery模拟title提示效果

31512017-07-05編輯:SW來源:技术博客 在線PDF預覽

当文字字符长度被限制后,总有些长标题会被截断,用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>



文章引用:https://www.hkhulian.com/infos/831.html
本文之圖文訊息香港網頁設計,香港App開發公司——香港互聯摘自互聯網,如有版權糾紛或違規,請聯繫我們刪除,谢谢。

上一篇: 暫無

下一篇: 暫無

感謝您訪問香港互聯,我們用13年的技術實力用心為您服務

高端網頁設計 • App定制開發 • 網路推廣服務

我們推薦直接電話溝通
+86-13828884598
9:00~18:30
+86-75536630177
szhulian@qq.com
香港互聯微信好友

掃碼微信加好友
請您標注微信說明

請提交您的需求

5 香港互聯微信好友
掃一掃,微信溝通