jquery thooClock实现一个时钟效果代码-html代码-BFW代码库

jquery thooClock实现一个时钟效果代码

代码语言：html

代码描述：jquery thooClock实现一个时钟效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <style>

        body {
            /*padding:50px 0px 0px 0px;*/
            margin: 0;
            font-family: 'PT sans';
            color#222;
            text-align: center;
            -webkit-transition-duration: .1s;
            -moz-transition-duration: .1s;
            -o-transition-duration: .1s;
            -transition-duration: .1s;
            animation-timing-function: ease-in-out;
            -webkit-animation-timing-function: ease-in-out;

            background-image: url(../img/vignette.png);
            text-rendering: optimizeLegibility;
            -webkit-text-rendering: optimizeLegibility;
            -moz-text-rendering: optimizeLegibility;

            background-repeat: no-repeat;
            background-position: center center;
            background-attachment: fixed;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
        }

        h2 {
            font-size: 30px;
            color: #000;
            text-shadow: 1px 1px 1px #fff;
        }


        h3 {
            font-size: 20px;
            color: #000;
            text-shadow: 1px 1px 1px #fff;
            margin: 50px 0px 10px 0px;
        }

        canvas {}

        .container {
            width: 100%;
            display: inline-block;
            vertical-align: middle;
            text-align: center;
        }

        .clock {
            display: inline;
        }

        .alarm {
            display: none;
            margin: 10px 0px 0px 0px;
        }

        .alarm a {
            text-decoration: none;
            padding: 5px 10px 5px 10px;
            color: #FFF;
            background-color: #026729;
            border-radius: 5px;
        }

        .alarm a:hover {
            text-decoration: none;
            padding: 4px 9px 4px 9px;
            color: #fefefe;
            background-color: #026729;
            border-radius: 5px;
        }

        #set {
            text-decoration: none;
            padding: 5px 10px 5px 10px;
            color: #FFF;
            background-color: #F3A829;
            border-radius: 5px;
        }

        #set:hover {
            text-decoration: none;
            padding: 4px 9px 4px 9px;
            color: #fefefe;
            background-color: #F3A829;
            border-radius: 5px;
        }

    </style>
    <link href='https://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>


</head>
<body>
    <div class="htmleaf-container">

        <div class="container">
            <div id="myclock"></div>
            <div id="alarm1" class="alarm">
                <a href="javascript:void(0)" id="turnOffAlarm">ALARM.........完整代码请登录后点击上方下载按钮下载查看