久久国产成人av_抖音国产毛片_a片网站免费观看_A片无码播放手机在线观看,色五月在线观看,亚洲精品m在线观看,女人自慰的免费网址,悠悠在线观看精品视频,一级日本片免费的,亚洲精品久,国产精品成人久久久久久久

搜索

分享

QQ空間 QQ好友新浪微博微信

CSS3倒計時警報燈樣式代碼

昵稱48806104 2017-11-09

展開全文

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>CSS3倒計時警報燈樣式代碼</title>

<style>

body {background-color:#112;}

.nixcont{margin-left: auto;

margin-right: auto;

width: fit-content;

overflow: hidden;}

.nixcont{position: absolute;

top: 50%; left:50%;

transform: translate(-50%,-50%);}

.nixpair{padding:0px 5px; float:left; height:100px;pointer-events:none;}

.nixbg{

font-family: 'Josefin Sans', sans-serif;

font-size:70px;

box-sizing:border-box;

position:relative;height:80px;line-height:80px; width:50px; float:left;

border-radius: 20px;

border-bottom-left-radius:0px;

border-bottom-right-radius:0px;

padding-top:8px; margin:0px 5px;

box-shadow:

inset 0px 1px 3px 2px rgba(90, 0, 0, 0.9),

inset 0px 2px 2px 3px rgba(230, 220, 0, 1),

inset 0px 4px 4px 3px rgba(255, 0, 0, 0.9);

background-image:url("img/9fcf8fd2-fe09-45d2-873a-744b12b00065.png"),

-webkit-linear-gradient(top, rgba(35, 20, 40, 0.7),

rgba(35, 20, 40, 0.5),

rgba(35, 20, 110, 0.7));

background-image:url("img/9fcf8fd2-fe09-45d2-873a-744b12b00065.png"),

-moz-linear-gradient(top, rgba(35, 20, 40, 0.7),

rgba(35, 20, 40, 0.5),

rgba(35, 20, 110, 0.7));

background-image:url("img/9fcf8fd2-fe09-45d2-873a-744b12b00065.png"),

-ms-linear-gradient(top, rgba(35, 20, 40, 0.7),

rgba(35, 20, 40, 0.5),

rgba(35, 20, 110, 0.7));

background-image:url("img/9fcf8fd2-fe09-45d2-873a-744b12b00065.png"),

-o-linear-gradient(top, rgba(35, 20, 40, 0.7),

rgba(35, 20, 40, 0.5),

rgba(35, 20, 110, 0.7));

background-image:url("img/9fcf8fd2-fe09-45d2-873a-744b12b00065.png"),

linear-gradient(top, rgba(35, 20, 40, 0.7),

rgba(35, 20, 40, 0.5),

rgba(35, 20, 110, 0.7));

background-repeat:repeat, no-repeat;

background-size:12px, 100%;

}

.nixbg:after{

content:'';

display:block;

position:absolute;top:100%; left:0; width:100%; height:20%; background-color:gray;

border-bottom-left-radius:35%;

border-bottom-right-radius:35%;

background-image:-webkit-radial-gradient( 40% 100% , #ea4 0%, #f93 15%, #caa 50%, #778 75%, #345 100% );

background-image: -moz-radial-gradient( 40% 100% , #ea4 0%, #f93 15%, #caa 50%, #778 75%, #345 100% );

background-image: -ms-radial-gradient( 40% 100% , #ea4 0%, #f93 15%, #caa 50%, #778 75%, #345 100% );

background-image: -o-radial-gradient( 40% 100% , #ea4 0%, #f93 15%, #caa 50%, #778 75%, #345 100% );

background-image: radial-gradient( 40% 100% , #ea4 0%, #f93 15%, #caa 50%, #778 75%, #345 100% );

}

.nixbg .nix{

width:100%; text-align:center; position:absolute;

color:rgba(60, 40, 20, 1 );

pointer-events:none;

transition:color 0.5s, text-shadow 0.5s;

transition-timing-function:ease-out;

}

.nixbg .nix_open{

transition:color 0.2s, text-shadow 0.2s;

transition-timing-function:ease-out;

color: transparent;

text-shadow:

0 0 1px rgba(254, 252, 124, 1 ),

0 0 3px rgba(255, 217, 54, 0.7 ),

0 0 5px rgba(255, 0, 0, 1 ),

0 0 14px rgba(255, 0, 0, 1 ),

0 0 17px rgba(255, 0, 0, 1 ),

0 0 20px rgba(255, 0, 0, 1 ),

0 5px 25px rgba(0, 0, 255, 0.9 );

font-weight:300;

z-index:10;

}

</style>

</head>

<body>

<link href="https://www./css?family=Josefin+Sans:300" rel="stylesheet">

<script>

window.onload = function() {

startTime();

};

</script>

<div class="nixcont">

<div class="nixpair">

<div class="nixbg">

<div id="nix_h1_0" class="nix">0</div>

<div id="nix_h1_1" class="nix">1</div>

<div id="nix_h1_2" class="nix">2</div>

<div id="nix_h1_3" class="nix">3</div>

<div id="nix_h1_4" class="nix">4</div>

<div id="nix_h1_5" class="nix">5</div>

<div id="nix_h1_6" class="nix">6</div>

<div id="nix_h1_7" class="nix">7</div>

<div id="nix_h1_8" class="nix">8</div>

<div id="nix_h1_9" class="nix">9</div>

</div>

<div class="nixbg">

<div id="nix_h2_0" class="nix">0</div>

<div id="nix_h2_1" class="nix">1</div>

<div id="nix_h2_2" class="nix">2</div>

<div id="nix_h2_3" class="nix">3</div>

<div id="nix_h2_4" class="nix">4</div>

<div id="nix_h2_5" class="nix">5</div>

<div id="nix_h2_6" class="nix">6</div>

<div id="nix_h2_7" class="nix">7</div>

<div id="nix_h2_8" class="nix">8</div>

<div id="nix_h2_9" class="nix">9</div>

</div>

</div>

<div class="nixpair">

<div class="nixbg">

<div id="nix_m1_0" class="nix">0</div>

<div id="nix_m1_1" class="nix">1</div>

<div id="nix_m1_2" class="nix">2</div>

<div id="nix_m1_3" class="nix">3</div>

<div id="nix_m1_4" class="nix">4</div>

<div id="nix_m1_5" class="nix">5</div>

<div id="nix_m1_6" class="nix">6</div>

<div id="nix_m1_7" class="nix">7</div>

<div id="nix_m1_8" class="nix">8</div>

<div id="nix_m1_9" class="nix">9</div>

</div>

<div class="nixbg">

<div id="nix_m2_0" class="nix">0</div>

<div id="nix_m2_1" class="nix">1</div>

<div id="nix_m2_2" class="nix">2</div>

<div id="nix_m2_3" class="nix">3</div>

<div id="nix_m2_4" class="nix">4</div>

<div id="nix_m2_5" class="nix">5</div>

<div id="nix_m2_6" class="nix">6</div>

<div id="nix_m2_7" class="nix">7</div>

<div id="nix_m2_8" class="nix">8</div>

<div id="nix_m2_9" class="nix">9</div>

</div>

</div>

<div class="nixpair">

<div class="nixbg">

<div id="nix_s1_0" class="nix">0</div>

<div id="nix_s1_1" class="nix">1</div>

<div id="nix_s1_2" class="nix">2</div>

<div id="nix_s1_3" class="nix">3</div>

<div id="nix_s1_4" class="nix">4</div>

<div id="nix_s1_5" class="nix">5</div>

<div id="nix_s1_6" class="nix">6</div>

<div id="nix_s1_7" class="nix">7</div>

<div id="nix_s1_8" class="nix">8</div>

<div id="nix_s1_9" class="nix">9</div>

</div>

<div class="nixbg">

<div id="nix_s2_0" class="nix">0</div>

<div id="nix_s2_1" class="nix">1</div>

<div id="nix_s2_2" class="nix">2</div>

<div id="nix_s2_3" class="nix">3</div>

<div id="nix_s2_4" class="nix">4</div>

<div id="nix_s2_5" class="nix">5</div>

<div id="nix_s2_6" class="nix">6</div>

<div id="nix_s2_7" class="nix">7</div>

<div id="nix_s2_8" class="nix">8</div>

<div id="nix_s2_9" class="nix">9</div>

</div>

</div>

</div><script>

//These functions help add, remove or toggle css classes

function tog_class(id, cl) {

var elem = document.getElementById(id);

if (elem.classList.contains(cl) === true) {

elem.classList.remove(cl);

} else {

elem.classList.add(cl);

}

}

function add_class(id, cl) {

var elem = document.getElementById(id);

if (elem.classList.contains(cl) !== true) {

elem.classList.add(cl);

}

}

function rem_class(id, cl) {

var elem = document.getElementById(id);

if (elem.classList.contains(cl) === true) {

elem.classList.remove(cl);

}

}

//This function gets the date and does operations using H/M/S

function startTime() {

var today = new Date();

var h = today.getHours();

var m = today.getMinutes();

var s = today.getSeconds();

var h1 = (h - h % 10) / 10;

var h2 = h % 10;

var m1 = (m - m % 10) / 10;

var m2 = m % 10;

var s1 = (s - s % 10) / 10;

var s2 = s % 10;

set_nix_class("s1", s1);

set_nix_class("s2", s2);

set_nix_class("m1", m1);

set_nix_class("m2", m2);

set_nix_class("h1", h1);

set_nix_class("h2", h2);

var t = setTimeout(startTime, 500);

}

//This function calls the appropriate class changes

function set_nix_class(target, val) {

for (i = 0; i < 10; i++) {

if (i != val) {

rem_class("nix_" + target + "_" + i, "nix_open");

}

}

add_class("nix_" + target + "_" + val, "nix_open");

}

</script>

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';color:#ffffff">

<p>適用瀏覽器：360,、FireFox、Chrome,、Safari,、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下瀏覽器,。</p>

<p>來源：<a href="http://down./" target="_blank"> </a></p>

</div>

</body>

</html>

本站是提供個人知識管理的網(wǎng)絡(luò)存儲空間，所有內(nèi)容均由用戶發(fā)布,，不代表本站觀點,。請注意甄別內(nèi)容中的聯(lián)系方式,、誘導(dǎo)購買等信息,，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,，請點擊一鍵舉報,。

轉(zhuǎn)藏 分享

QQ空間 QQ好友新浪微博微信

獻(xiàn)花（0） +1

來自：昵稱48806104 > 《文件夾1》

舉報/認(rèn)領(lǐng)

0條評論

請遵守用戶評論公約

類似文章 更多

昵稱48806104

關(guān)注對話

TA的最新館藏

CSS3多米諾骨牌動畫代碼
jQuery點擊小圖控制大圖切換代碼
CSS3倒計時警報燈樣式代碼
jQuery圖片篩選過濾器插件
jQuery經(jīng)過圖片高亮手風(fēng)琴代碼
jQuery城市選擇單選多選代碼

喜歡該文的人也喜歡更多

熱門閱讀換一換