微博の名刺作り
2177 ワード
<!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>