文章专题学习下载问答编程词典手游最近更新

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

首页 > web前端 > js教程 > 正文

超级可爱纯js网页时钟_时间日期

WBOY

发布： 2016-05-16 19:15:18

原创

1201 人浏览过

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<meta content="MSHTML 6.00.6000.16414" name="GENERATOR"> 
 
<div style="LEFT: 155px; WIDTH: 400px; ZOOM: 1; POSITION: absolute; TOP: 133px; HEIGHT: 300px"> 
<div id="bg" style="LEFT: -22px; WIDTH: 150px; ZOOM: 1.5; POSITION: absolute; TOP: -57px; HEIGHT: 150px">
<img    style="max-width:90%" src="http://files.jb51.net/upload/novelty.gif" alt="超级可爱纯js网页时钟_时间日期" >  
</div> 
<div id="h" style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; WIDTH: 129px; PADDING-TOP: 5px; POSITION: absolute; HEIGHT: 129px">
<img    style="max-width:90%" src="http://files.jb51.net/upload/novelty_h.gif" alt="超级可爱纯js网页时钟_时间日期" >  
</div> 
<div id="m" style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; WIDTH: 129px; PADDING-TOP: 5px; POSITION: absolute; HEIGHT: 129px">
<img    style="max-width:90%" src="http://files.jb51.net/upload/novelty_m.gif" alt="超级可爱纯js网页时钟_时间日期" >  
</div> 
<div id="s" style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; WIDTH: 129px; PADDING-TOP: 5px; POSITION: absolute; HEIGHT: 129px">
<img    style="max-width:90%" src="http://files.jb51.net/upload/novelty_s.gif" alt="超级可爱纯js网页时钟_时间日期" >  
</div> 
<div id="dot" style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; WIDTH: 129px; PADDING-TOP: 5px; POSITION: absolute; HEIGHT: 129px">
<img    style="max-width:90%" src="http://files.jb51.net/upload/novelty_dot.gif" alt="超级可爱纯js网页时钟_时间日期" >  
</div> 
<div> 
<script> 
//oObj input requires that a matrix filter be applied.  
//deg input defines the requested angle of rotation. 
var deg2radians = Math.PI * 2 / 360; 
function MatrixFilter(obj) 
{     
    if(!obj.filters)return; 
    //alert(obj.filters.item(0)); 
    var Matrix; 
    for(p in obj.filters) 
    {        
        if(p=="DXImageTransform.Microsoft.Matrix")Matrix=obj.filters["DXImageTransform.Microsoft.Matrix"];   
    } 
    if(!Matrix) 
    { 
        obj.style.filter+="progid:DXImageTransform.Microsoft.Matrix()"; 
    } 
    Matrix=obj.filters["DXImageTransform.Microsoft.Matrix"]; 
    this.equal=function(Matrix2D_x) 
    { 
        if(Matrix2D_x.M11)Matrix.M11 = Matrix2D_x.M11; 
        if(Matrix2D_x.M12)Matrix.M12 = Matrix2D_x.M12; 
        if(Matrix2D_x.M21)Matrix.M21 = Matrix2D_x.M21; 
        if(Matrix2D_x.M22)Matrix.M22 = Matrix2D_x.M22; 
    } 
     
    if(arguments[1])this.equal(arguments[1]); 
     
    this.Rotate=function(deg) 
    { 
        rad = deg * deg2radians; 
        costheta = Math.cos(rad); 
        sintheta = Math.sin(rad); 
        var d=new Matrix2D(costheta,-sintheta,sintheta,costheta); 
        this.equal(Matrix2D.Mul(Matrix,d)); 
    } 
    this.RotateTo=function(deg) 
    { 
        rad = deg * deg2radians; 
        costheta = Math.cos(rad); 
        sintheta = Math.sin(rad); 
        var d=new Matrix2D(costheta,-sintheta,sintheta,costheta); 
        this.equal(d); 
    } 
    this.RotateAt=function(deg,sx,sy) 
    { 
        rad = deg * deg2radians; 
        costheta = Math.cos(rad); 
        sintheta = Math.sin(rad); 
        var d=new Matrix2D(costheta,-sintheta,sintheta,costheta); 
        var x=sx-Matrix.Dx; 
        var y=sy-Matrix.Dy; 
        this.MoveTo(x*costheta+y*sintheta-x,-x*sintheta+y*costheta-y); 
        this.equal(Matrix2D.Mul(Matrix,d));        
    } 
    this.RotateToAt=function(deg,sx,sy) 
    { 
        rad = deg * deg2radians; 
        costheta = Math.cos(rad); 
        sintheta = Math.sin(rad); 
        var d=new Matrix2D(costheta,-sintheta,sintheta,costheta); 
        var x=sx; 
        var y=sy; 
        this.MoveTo(x-(x*costheta-y*sintheta),-(x*sintheta+y*costheta-x)); 
        this.equal(d); 
    }

this.MoveTo=function(sx,sy) 
    { 
        Matrix.Dx=sx; 
        Matrix.Dy=sy; 
    } 
    this.toMatrix2D=function() 
    { 
        return new Matrix2D(Matrix.M11,Matrix.M12,Matrix.M21,Matrix.M22); 
    } 
    this.ZoomBy=function(sx,sy) 
    { 
        var d=new Matrix2D(sx,0,0,sy); 
        this.equal(Matrix2D.Mul(Matrix,d)); 
    } 
    this.toString=function() 
    { 
        return ""+Matrix.M11+" "+Matrix.M12+"\n"+Matrix.M21+" "+Matrix.M22+"\n" 
    } 
    //Matrix.SizingMethod='clip to original'; 
    //this.fnSetRotation(30); 
    //alert(Matrix.M11); 
    //alert(obj.filters["DXImageTransform.Microsoft.Matrix"]); 
} 
function Matrix2D() 
{ 
    this.M11 = arguments[0]||1; 
    this.M12 = arguments[1]||0; 
    this.M21 = arguments[2]||0; 
    this.M22 = arguments[3]||1; 
    this.Mul_Matrix2D=function(Matrix2D_b) 
    { 
        var r=new Matrix2D(); 
        r=Matrix2D.Mul(this,Matrix2D_b);         
        return r;        
    } 
    this.toString=function() 
    { 
        return ""+this.M11+" "+this.M12+"\n"+this.M21+" "+this.M22+"\n" 
    } 
} 
Matrix2D.Mul=function(Matrix2D_a,Matrix2D_b) 
{ 
    var r=new Matrix2D(); 
    r.M11=Matrix2D_a.M11*Matrix2D_b.M11+Matrix2D_a.M12*Matrix2D_b.M21; 
    r.M12=Matrix2D_a.M11*Matrix2D_b.M12+Matrix2D_a.M12*Matrix2D_b.M22; 
    r.M21=Matrix2D_a.M21*Matrix2D_b.M11+Matrix2D_a.M22*Matrix2D_b.M21; 
    r.M22=Matrix2D_a.M21*Matrix2D_b.M12+Matrix2D_a.M22*Matrix2D_b.M22; 
    return r;      
}

var ms=new MatrixFilter(s); 
var mm=new MatrixFilter(m); 
var mh=new MatrixFilter(h); 
var i=1; 
setInterval("ms.RotateToAt((new Date()).getSeconds()*6+6,69,69)",500); 
setInterval("mm.RotateToAt((new Date()).getMinutes()*6+6,69,69)",500); 
setInterval("mh.RotateToAt(((new Date()).getHours()+(new Date()).getMinutes()/60)*30,69,69)",500); 
//mf.MoveTo(30,70); 
//mf.ZoomBy(1.5,1.5); 
//mf.ZoomBy(1.5,1.5); 
//alert(mf.toMatrix2D());

//alert(Matrix2D.Mul(m2d1,m2d2)); 
//fnSetRotation(oDiv.filters.item(0),30); 
</script> 
</div>
</div>

相关标签：

超级可爱纯js网页时钟

来源：php.cn

上一篇：对google个性主页的拖拽效果的js的完整注释[转]_javascript技巧下一篇：FireFox中textNode分片的问题_javascript技巧

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

作者最新文章

什么是 NullPointerException，如何修复它？

2024-10-22 09:46:29
从新手到程序员：您的旅程从 C 基础知识开始

2024-10-13 13:53:41
使用PHP解锁网络开发：初学者指南

2024-10-12 12:15:51
揭秘 C：为新程序员提供一条清晰简单的道路

2024-10-11 22:47:31
释放您的编码潜力：绝对初学者的 C 编程

2024-10-11 19:36:51
释放你内心的程序员：C 绝对初学者

2024-10-11 15:50:41
使用 C 自动化您的生活：适合初学者的脚本和工具

2024-10-11 15:07:41
PHP 变得简单：Web 开发的第一步

2024-10-11 14:21:21
使用 Python 构建任何东西：释放创造力的初学者指南

2024-10-11 12:59:11
编码的关键：为初学者释放 Python 的力量

2024-10-11 12:17:31

最新问题

function_exists()无法判定自定义函数 function test() { return true; } if (function_exists('TEST')) { ech...

来自于 2024-04-29 11:01:01

0

2

1779

google 浏览器手机版显示的怎么实现老师您好，google 浏览器怎么变成手机版样式的？

来自于 2024-04-23 00:22:19

0

10

1924

子窗口操作父窗口，输出没反应前两句可执行，最后一句没法应

来自于 2024-04-19 15:37:47

0

1

1637

父窗口没有输出 document.onclick = function(){ window.opener.document.write('我是子窗口的输出'); ...

来自于 2024-04-18 23:52:34

0

1

1545

关于CSS思维导图的课件在哪？课件

来自于 2024-04-16 10:10:18

0

0

1579

相关专题

更多>

热门推荐

热门教程

更多>

相关教程

热门推荐

最新课程

最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)

1416752
php入门教程之一周学会PHP

4257339
JAVA 初级入门视频教程

2475463
小甲鱼零基础入门学习Python视频教程

503327
PHP 零基础入门教程

844061

最新下载

更多>

网站特效

网站源码

网站素材

前端模板

关于我们免责声明 Sitemap: PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！