微博名片制作

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var H = 0;
        var W = 0;
        var divobj = document.createElement("div");
        divobj.style.position = "fixed";
        divobj.style.border = "solid 10px red";
        divobj.style.width = "230px";
        divobj.style.height = "180px";
        divobj.style.zIndex = 100;
        divobj.style.backgroundColor = "#005eac";
        var obj;
        $(document).ready(function () {
            $("body div").live("mouseover", function () {
                obj = $(this);
                if (obj.attr("id") == undefined)
                    return;
                H = obj.offset().top;
                W = obj.offset().left;
                divobj.style.top = (H + obj.height() + 10) + "px";
                divobj.style.left = (W - (obj.width() / 2)) + "px";
                divobj.innerHTML = "内容 当前divid:" + obj.attr("id");
                $("body").prepend(divobj);
                $(divobj).fadeIn(400);
            });
            $("body div").live("mouseout", function () {
                window.setTimeout(closediv, 600, obj);
            });

        });
        function closediv(objs) {
            if(objs==obj)
            $(divobj).fadeOut(400);
        }
    </script>
</head>
<body>
    <div id="Boss" style="border: 3px solid red; position: fixed; top: 20px; left: 400px; height: 200px;">1sdfsdfsdfsdfsdf</div>
    <div id="Div1" style="border: 3px solid red; position: fixed; top: 20px; left: 600px; height: 200px;">sdfsdfsdfsdfsdf</div>
</body>
</html>

  

posted @ 2013-04-12 09:27  Ganler1988  阅读(199)  评论(0编辑  收藏  举报