码迷,mamicode.com
首页 > Web开发 > 详细

html a title 自定义样式显示

时间:2014-09-11 18:56:02      阅读:1183      评论:0      收藏:0      [点我收藏+]

标签:blog   color   io   os   ar   div   cti   log   on   

    $(function() {
        // show try product title 
       $(".tb7_try_box").find("a").each(function(d) {//这里是控制标签
            if ($(this).attr(‘mytitle‘)) {
                var c = $(this).attr(‘mytitle‘); //把title的赋给自定义属性 myTilte ,屏蔽自带提示
                var a = 30; //设置提示框相对于偏移位置,防止遮挡鼠标
                $(this).mouseover(function(d) { //鼠标移上事件
                    $("body").append(‘<div id="tooltip">‘ + c + "</div>"); //创建提示框,添加到页面中
                    $("#tooltip").css({
                        left: (d.pageX + a) + "px",
                        top: d.pageY + "px",
                        opacity: "0.8",
                        position:"absolute",
                        background:"#000",
                        color:"#fff",
                        padding:"5px",
                    }).show(250) //设置提示框的坐标,并显示
                }).mouseout(function() { //鼠标移出事件
                    $("#tooltip").remove() //移除弹出框
                }).mousemove(function(d) { //跟随鼠标移动事件
                    $("#tooltip").css({
                        left: (d.pageX + a) + "px",
                        top: d.pageY + "px"
                    })
                })
            }
        });
        
    });

  

html a title 自定义样式显示

标签:blog   color   io   os   ar   div   cti   log   on   

原文地址:http://www.cnblogs.com/bandbandme/p/3966885.html

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