小崔真好的专栏

Just do it!!!

活动倒计时+fixed定位+跳转到本页指定位置

<!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>position</title>
</head>

<body>
<?php 
 //实现php倒计时的功能
//php的时间是以秒算。js的时间以毫秒算  
 
date_default_timezone_set('PRC');
//date_default_timezone_set("Asia/Hong_Kong");//地区设置  
 
//配置每天的活动时间段  
$starttimestr = "2013-4-29 8:10:00"; 
$endtimestr = "2013-4-29 9:43:00"; 
 
$starttime = strtotime($starttimestr); 
$endtime = strtotime($endtimestr); 
$nowtime = time(); 
$lefttime = $endtime-$nowtime;
?> 
 
<script language="JavaScript"> 
var runtimes = 0; 
function GetRTime(){ 
var nMS = <?php echo $lefttime; ?>*1000-runtimes*1000; 
if (nMS>=0){ 
var nD=Math.floor(nMS/(1000*60*60*24))%24; 
var nH=Math.floor(nMS/(1000*60*60))%24; 
var nM=Math.floor(nMS/(1000*60)) % 60; 
var nS=Math.floor(nMS/1000) % 60; 
document.getElementById("RemainD").innerHTML=nD; 
document.getElementById("RemainH").innerHTML=nH; 
document.getElementById("RemainM").innerHTML=nM; 
document.getElementById("RemainS").innerHTML=nS; 
if(nMS==5*60*1000) 

alert("还有最后五分钟!"); 

runtimes++; 
setTimeout("GetRTime()",1000); 


window.onload=GetRTime; 
</script> 
 
<h4>距离活动开始还有 <strong id="RemainD"></strong>天 <strong id="RemainH"></strong>小时 <strong id="RemainM"></strong>分钟 <strong id="RemainS"></strong>秒</h4> 
<!--position:fixed是指悬浮框的位置相对于浏览器窗口固定-->
<!--onclick是指点击点击图片之后跳转到本页指定的位置-->
<div style="position:fixed; width:auto; top:300px; left:300px">
<img src="uploads/images/face/1.gif" onclick="location.href='#11'">
</div>
<div style="position:fixed; width:auto; top:330px; left:300px">
<img src="uploads/images/face/1.gif" onclick="location.href='#22'">
</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div id="11" style="color:red">变换下</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div id="22" style="color:green">come on!!!</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
<div>看看效果</div>
</body>
</html>

效果如如下(下面的时间显示是实时的):

活动倒计时+fixed定位+跳转到本页指定位置 - cuiruijunphp - 格式化。。。
活动倒计时+fixed定位+跳转到本页指定位置 - cuiruijunphp - 格式化。。。
 
 

 

阅读更多
上一篇解决#1289 - The \'InnoDB\' feature is disabled; you need MySQL built with \'InnoDB\' to have it working的问题
下一篇php函数getenv(“REMOTE_ADDR”)得不到ip[转载]
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭