<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<meta name="keyword" content="">
<title></title>
<style>
.opt-head{position: relative; width: 100%; height: 20px; top: 0px;left: 0px;z-index: 10;text-align: right;}
.opt-body{position: absolute; top:0px; left: -70px;height: 28px; background: #666; line-height: 30px; z-index: 11;padding: 0px 12px 0px 5px; display: none;}
.opt-body a{color: #eee;}
.opt-body span{display:inline-block;width: 20px;height: 20px; margin-right: 5px;}
.i-icon{color: #5cd1df; font-size: 14px; display: inline-block;}
.l-icon{color: #eee; font-size: 12px; display: inline-block;}
</style>
</head>
<body>
<div class="opt-head" id="opt-btn">
<span class="glyphicon glyphicon-menu-hamburger i-icon" ></span><div class="opt-body" id="opt-menu">
<a href="javascript:void(0);" οnclick="javascript:window.location.href='daily-add.html'">
<span class="glyphicon glyphicon-edit l-icon"></span> 编辑
</a>
<a href="javascript:void(0);" οnclick="toconfirm()" title="删除">
<span class="glyphicon glyphicon-trash l-icon"></span>删除
</a>
</div>
</div>
<script src="../skin/js/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$("#opt-btn").click(function(event){
//取消冒泡事件
event.stopPropagation();
$("#opt-menu").fadeToggle("slow");
});
//点击空白或者其他区域时隐藏
$(document).click(function(){
$("#opt-menu").fadeOut("slow");
});
//滚动屏幕
$(document).bind("scroll", srcollEvent);
function srcollEvent() {
if ($(document).scrollTop() > 0) {
$("#opt-menu").fadeOut("slow");
}
}
//长按屏幕
$(document).mousedown(function() {
var timeout = setTimeout(function() {
$("#opt-menu").fadeOut();
}, 1000);
});
});
</script>
</body>
</html>