维护浮动框

This commit is contained in:
= 2014-12-30 14:35:35 +08:00
parent 6a86e1c386
commit 305cbae008
3 changed files with 65 additions and 0 deletions

View File

@ -0,0 +1,64 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>浮动倒计时公告</title>
<style type="text/css">
/*网页高度*/
body{ height:3000px;}
div,ul,li,body{margin:0; padding:0;}
/*position:absolute;用于元素的定位*/
#roll{ background:url(/images/f_notice.jpg) 0 0 no-repeat;width:140px; height:217px; position:absolute;}
.timemsg{ margin-left:26px; margin-top:114px;color:#c02b2b; font-size:16px; font-weight:bold;}
</style>
</head>
<body>
<div id="roll">
<div class="timemsg">
<!-- <span id="t_d">00:</span> -->
<span id="t_h">00:</span>
<span id="t_m">00:</span>
<span id="t_s">00</span>
</div>
</div>
</body>
</html>
<script type="text/javascript">
function getRTime(){
var EndTime= new Date('2014/12/31 12:30:00'); //截止时间
var NowTime = new Date();
var t =EndTime.getTime() - NowTime.getTime();
// var d=Math.floor(t/1000/60/60/24);
var h=Math.floor(t/1000/60/60%24);
var m=Math.floor(t/1000/60%60);
var s=Math.floor(t/1000%60);
// document.getElementById("t_d").innerHTML = d + ":";
document.getElementById("t_h").innerHTML = h + ":";
document.getElementById("t_m").innerHTML = m + ":";
document.getElementById("t_s").innerHTML = s ;
}
setInterval(getRTime,1000);
</script>
<script>
var roll=document.getElementById('roll'),
initX=0,
initY,
compY,
sp=15,
//可调整时间间隔步进值不宜过大不然IE下有点闪屏
timeGap=5,
doc=document.documentElement,
docBody=document.body;
compY=initY=100;
roll.style.right=initX+"px";
;(function(){
var curScrollTop=(doc.scrollTop||docBody.scrollTop||0)-(doc.clientTop||docBody.clientTop||0);
//每次comP的值都不一样直到roll.style.top===doc.scrollTop+initY
compY+=(curScrollTop+initY-compY)/sp;
roll.style.top=Math.ceil(compY)+"px";
setTimeout(arguments.callee,timeGap);
})();
</script>

View File

@ -22,6 +22,7 @@
<div id="wrapper2">
<div id="wrapper3">
<%=render :partial => 'layouts/base_header'%>
<%= render :partial => 'layouts/base_ad' %>
<div id="main" class="nosidebar">
<div id="content_">
<%= render_flash_messages %>

BIN
public/images/f_notice.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB