JQ自定义的链接提示问题。

javascriptfunctionclass

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

$("#tooltip").css({
                 "top":(mousePos(ev).y) + "px",
                    "left":(mousePos(ev).x) + "px"</span>
                }).show("fast"); 这个地方运行不出效果
mousePos这个函数有必要么直接pageX即可。。
这题目我以前做过呢。
直接用e.pageY和e.pageX就好了。
代码如下，复制粘贴，把JQuery引用改下就好：    <script type="text/javascript">
        //偏移量
        var x = 10;
        var y = 20;
        $(document).ready(function () {
            $("a.tooltip")
                .mouseover(function (e) {
                    this.myTitle = this.title;
                    //将链接的title置为空。
                    this.title = "";
                    //设置tooltip。
                    var tooltip = "<div id='tooltip'>" + this.myTitle + "</div>";
                    $("body").append(tooltip);
                    //设置tooltip样式为红色。position设置为absolute。
                    $("#tooltip").css({
                        "color": "red",
                        "position": "absolute",
                        "top": (e.pageY + y) + "px",
                        "left": (e.pageX + x) + "px"
                    }).show("fast");
                }).mouseout(function () {
                    //mouseout事件，恢复原样。
                    this.title = this.myTitle;
                    $("#tooltip").remove();
                }).mousemove(function (e) {
                    //mousemove事件
                    $("#tooltip").css({
                        "color": "red",
                        "position": "absolute",
                        "top": (e.pageY + y) + "px",
                        "left": (e.pageX + x) + "px"
                    });
                });
        });
    </script>
<body>
    <p><a href="#" class="tooltip" title="这是我的提示1">我的提示1</a></p>
    <p><a href="#" class="tooltip" title="这是我的提示2">我的提示2</a></p>    <p><a href="#" title="这是自带提示1">自带提示1</a></p>
    <p><a href="#" title="这是自带提示2">自带提示2</a></p>
</body>
FF浏览器和IE坐标取值方法不同，才自定义了一个函数。在ie9测试的时候，pageX取不到值，所以才用了这样一个函数
对比层主代码，引用了"position": "absolute",这个位置属性，果然成功出现了
既然使用JQuery，那就不必考虑不同浏览器兼容性问题！