网页右下角的指针表,纯JavaScript实现

<title>网页右下角的指针表,纯JavaScript实现丨聚来宝官网注册|天津kiddy</title>
    <SCRIPT LANGUAGE="JavaScript">
    fCol = ‘000000‘;
    sCol = ‘ff0000‘;
    mCol = ‘000000‘;
    hCol = ‘000000‘;
    H = ‘....‘;
    H = H.split(‘‘);
    M = ‘.....‘;
    M = M.split(‘‘);
    S = ‘......‘;
    S = S.split(‘‘);
    Ypos = 0;
    Xpos = 0;
    Ybase = 8;
    Xbase = 8;
    dots = 12;
    ns = (document.layers)?1:0;
    if (ns) {
    dgts = ‘1 2 3 4 5 6 7 8 9 10 11 12‘;
    dgts = dgts.split(‘ ‘);
    for (i = 0; i < dots; i++) {
    document.write(‘<layer name=nsDigits‘+i+‘ top=0 left=0 height=30 width=30><center><font face=Arial,Verdana size=1 color=‘+fCol+‘>‘+dgts[i]+‘</font></center></layer>‘);
    }
    for (i = 0; i < M.length; i++) {
    document.write(‘<layer name=ny‘+i+‘ top=0 left=0 bgcolor=‘+mCol+‘ clip="0,0,2,2"></layer>‘);
    }
    for (i = 0; i < H.length; i++) {
    document.write(‘<layer name=nz‘+i+‘ top=0 left=0 bgcolor=‘+hCol+‘ clip="0,0,2,2"></layer>‘);
    }
    for (i = 0; i < S.length; i++) {
    document.write(‘<layer name=nx‘+i+‘ top=0 left=0 bgcolor=‘+sCol+‘ clip="0,0,2,2"></layer>‘);
    }
    }
    else {
    document.write(‘<div style="position:absolute;top:0px;left:0px"><div style="position:relative">‘);
    for (i = 1; i < dots+1; i++) {
    document.write(‘<div id="ieDigits" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial,Verdana;font-size:10px;color:‘+fCol+‘;text-align:center;padding-top:10px">‘+i+‘</div>‘);
    }
    document.write(‘</div></div>‘)
    document.write(‘<div style="position:absolute;top:0px;left:0px"><div style="position:relative">‘);
    for (i = 0; i < M.length; i++) {
    document.write(‘<div id=y style="position:absolute;width:2px;height:2px;font-size:2px;background:‘+mCol+‘"></div>‘);
    }
    document.write(‘</div></div>‘)
    document.write(‘</div></div>‘)
    document.write(‘<div style="position:absolute;top:0px;left:0px"><div style="position:relative">‘);
    for (i = 0; i < H.length; i++) {
    document.write(‘<div id=z style="position:absolute;width:2px;height:2px;font-size:2px;background:‘+hCol+‘"></div>‘);
    }
    document.write(‘</div></div>‘)
    document.write(‘<div style="position:absolute;top:0px;left:0px"><div style="position:relative">‘);
    for (i = 0; i < S.length; i++) {
    document.write(‘<div id=x style="position:absolute;width:2px;height:2px;font-size:2px;background:‘+sCol+‘"></div>‘);
    }
    document.write(‘</div></div>‘)
    }
    function clock() {
    time = new Date ();
    secs = time.getSeconds();
    sec = -1.57 + Math.PI * secs/30;
    mins = time.getMinutes();
    min = -1.57 + Math.PI * mins/30;
    hr = time.getHours();
    hrs = -1.57 + Math.PI * hr/6 + Math.PI*parseInt(time.getMinutes())/360;
    if (ns) {
    Ypos = window.pageYOffset+window.innerHeight-60;
    Xpos = window.pageXOffset+window.innerWidth-80;
    }
    else {
    Ypos = document.body.scrollTop + window.document.body.clientHeight - 60;
    Xpos = document.body.scrollLeft + window.document.body.clientWidth - 60;
    }
    if (ns) {
    for (i = 0; i < dots; ++i){
    document.layers["nsDigits"+i].top = Ypos - 5 + 40 * Math.sin(-0.49+dots+i/1.9);
    document.layers["nsDigits"+i].left = Xpos - 15 + 40 * Math.cos(-0.49+dots+i/1.9);
    }
    for (i = 0; i < S.length; i++){
    document.layers["nx"+i].top = Ypos + i * Ybase * Math.sin(sec);
    document.layers["nx"+i].left = Xpos + i * Xbase * Math.cos(sec);
    }
    for (i = 0; i < M.length; i++){
    document.layers["ny"+i].top = Ypos + i * Ybase * Math.sin(min);
    document.layers["ny"+i].left = Xpos + i * Xbase * Math.cos(min);
    }
    for (i = 0; i < H.length; i++){
    document.layers["nz"+i].top = Ypos + i * Ybase * Math.sin(hrs);
    document.layers["nz"+i].left = Xpos + i * Xbase * Math.cos(hrs);
    }
    }
    else{
    for (i=0; i < dots; ++i){
    ieDigits[i].style.pixelTop = Ypos - 15 + 40 * Math.sin(-0.49+dots+i/1.9);
    ieDigits[i].style.pixelLeft = Xpos - 14 + 40 * Math.cos(-0.49+dots+i/1.9);
    }
    for (i=0; i < S.length; i++){
    x[i].style.pixelTop = Ypos + i * Ybase * Math.sin(sec);
    x[i].style.pixelLeft = Xpos + i * Xbase * Math.cos(sec);
    }
    for (i=0; i < M.length; i++){
    y[i].style.pixelTop = Ypos + i * Ybase * Math.sin(min);
    y[i].style.pixelLeft = Xpos + i * Xbase * Math.cos(min);
    }
    for (i=0; i < H.length; i++){
    z[i].style.pixelTop = Ypos + i * Ybase*Math.sin(hrs);
    z[i].style.pixelLeft = Xpos + i * Xbase*Math.cos(hrs);
    }
    }
    setTimeout(‘clock()‘, 50);
    }
    if (document.layers || document.all) window.onload = clock;
    </script>
    <br><br><hr>
时间: 2024-11-05 23:22:48

网页右下角的指针表,纯JavaScript实现的相关文章

添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常

这两天想在网页中添加一个添加浮动按钮,点击该按钮滚动则到网页底部.在网上bing搜索了一下,大多是JQuery的. 我想要纯JavaScript的,只好DIY了.在IE9.11,Maxthon 1.6.7,Firefox30.31,360极速浏览器7.5.3.308下测试正常. 其中难点在于,setScrollBottom这个函数. 按常规写法: function setScrollBottom(value) { if (document.documentElement.scrollTop){

网页右下角弹出窗体

<!--开始--><style type="text/css"> #msg_win{position:absolute;right:0px;display:none;overflow:hidden;z-index:99;border:1px solid #c00;background:#F9EFFC;width:210px;font-size:12px;margin:0px;} #msg_win .icos{position:absolute;top:2px;*

网页绘制图表 Google Charts with JavaScript #2 ....与ASP.NET网页结合 (ClientScriptManager.RegisterStartupScript 方法)

此为文章备份,原文出处(我的网站) 网页绘制图表 Google Charts with JavaScript #2 ....与ASP.NET网页结合 (ClientScriptManager.RegisterStartupScript 方法) http://www.dotblogs.com.tw/mis2000lab/archive/2014/05/10/google_charts-with-asp.net-clientscriptmanager.registerstartupscript.as

jQuery实现网页右下角悬浮层提示

最近有同事提到类似网页右下角的消息悬浮提示框的制作.我之前也做过一个类似的例子,很简单.是仿QQ消息.现在感觉之前的那个例子只是说了实现原理,整体上给你的感觉还是太丑,今天为大家带来一个新的例子.是Discuz右下角悬浮层提示的.运行效果如下: 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-trans

纯javascript验证,100行超精简代码。

这篇文章转自--寒飞,原帖地址http://blog.csdn.net/luoyehanfei/article/details/42262249 QQ交流群235032949 纯javascript验证库详解 还是坚持一贯的原则,编写任何一个插件的时候不引用其它框架.这样做的好处与坏处. 好处:耦合度降低,提升自我编码水平,总有一天你就能成为编写框架的大神. 坏处:琐碎,耗时一点. javascript的验证网上铺天盖地很多,jquery.validate.js也是非常强大的.为什么还要重复造轮

纯javascript写的table加载,包含分页、数据下载功能

直接先上效果图看看先. 首先简单说明一下,后面会给所涉及到的代码都贴上来的. 1.excel图标是一个用户控件,用来触发下载 2.首页.上页......每页多少条,这一块是一个整体,你可以选择放置在表格下面,或者表格上面都可以 3.表格则也是单独的一个,自己任意设置位置 4.复选框是否显示,自己设置,并可设置绑定的值,并有自带的方法可供你用于获取选中的复选框的对象跟值 5.表格的单行.双行.点击.悬浮.标题栏.表格的样式,都可以通过设置参数来修改,图为自带的效果 6.分页默认每页10行,分页的检

最新dedecms网页游戏开服表发号网站源码模板

模板介绍 最新dedecms网页游戏开服表发号网站源码模板,让你更精确的把握游戏开服时间和战略技巧. 这套网页游戏模板是织梦二次开发后的一套网页源码,后台也是经过二次开发后,适合游戏网站的一些参数说明及添加信息. 模板文件: 404.htm            大气的404页面 article_fahao.htm  发号模板详细页 article_time.htm   发号时间详细页 footer_time.htm    发号时间底部模板 head_time.htm      发号时间头部模板

javascript日历控件——纯javascript版

平时只有下班时间能code,闲来写了个纯javascript版.引用该calendar.js文件,然后给要设置成日历控件的input的id设置成calendar,该input就会变成日历控件. <!doctype html> <html> <head> <meta charset="utf-8"> <title>日历控件</title> <script src="js/calendar.js&quo

网页绘制图表 Google Charts with JavaScript #1....好强、好简单啊!

此为文章备份,原文出处(我的网站) 网页绘制图表 Google Charts with JavaScript....好强.好简单啊!#1 http://www.dotblogs.com.tw/mis2000lab/archive/2014/01/23/google_charts-javascript.aspx 今天看见 g+一篇文章 http://inspiredtoeducate.net/inspiredtoeducate/?p=1319 因而发觉这个东西. 我先连到 Google原厂网站,看