大家好，又见面了，我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

点击文章下面超链接，即可免费下载，源码以及文件素材，无需积分，关注后即可下载

资源须知：

因为资源是我去年上传的，所以最近下载这个资源的同学，可能会出现倒计时为负的情况，下面是解决办法：

找到js文件夹在这里插入图片描述
打开找到app.js

可以就用记事本打开，然后保存，在此点击index.html运行即可

最近由于不知道什么情况，上传的资源，他老是在审核中，本来打算重新上传一个的，但是没办法，无法通过，你们在修改的过程中，没有编程基础的不要动其他的代码，如果有基础的，可以试着添加一些功能，搞一些花里胡哨的效果，另外我会把本篇文章置顶，方便各位寻找

记得关注，只有关注后才可以下载！！！

效果图：钟表以及时间文字显示会自动根据打开网页的时间，显示时间；无需自己修改，弹幕和文字皆可以修改；背景是渐变色彩，可根据自己的需要在源码中修改即可，除了主要功能是HTML意外，还有CSS、JS等源码，就算没有编程工具，电脑没有任何编程配置，只需要打开文件，鼠标双击运行index即可，会自动跳到系统默认浏览器内，就算毫无编程基础、英语小白页可以娱乐；
本源码意在学习与娱乐，未经授权！！禁止商用！！！

编码不易如有帮助到您请支持一下多谢

部分源码

CSS源码：

/*! * Bootstrap v3.3.4 (http://getbootstrap.com) * Copyright 2011-2015 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
html { 

font-family: sans-serif;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
body { 

margin: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { 

display: block;
}
audio, canvas, progress, video { 

display: inline-block;
vertical-align: baseline;
}
audio:not([controls]) { 

display: none;
height: 0;
}
[hidden], template { 

display: none;
}
a { 

background-color: transparent;
}
a:active, a:hover { 

outline: 0;
}
abbr[title] { 

border-bottom: 1px dotted;
}
b, strong { 

font-weight: bold;
}
dfn { 

font-style: italic;
}
h1 { 

margin: .67em 0;
font-size: 2em;
}
mark { 

color: #000;
background: #ff0;
}
small { 

font-size: 80%;
}
sub, sup { 

position: relative;
font-size: 75%;
line-height: 0;
vertical-align: baseline;
}
sup { 

top: -.5em;
}
sub { 

bottom: -.25em;
}
img { 

border: 0;
}
svg:not(:root) { 

overflow: hidden;
}
figure { 

margin: 1em 40px;
}
hr { 

height: 0;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
pre { 

overflow: auto;
}
code, kbd, pre, samp { 

font-family: monospace, monospace;
font-size: 1em;
}
button, input, optgroup, select, textarea { 

margin: 0;
font: inherit;
color: inherit;
}
button { 

overflow: visible;
}
button, select { 

text-transform: none;
}
button, html input[type="button"], input[type="reset"], input[type="submit"] { 

-webkit-appearance: button;
cursor: pointer;
}
button[disabled], html input[disabled] { 

cursor: default;
}
button::-moz-focus-inner, input::-moz-focus-inner { 

padding: 0;
border: 0;
}
input { 

line-height: normal;
}
input[type="checkbox"], input[type="radio"] { 

-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { 

height: auto;
}
input[type="search"] { 

-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
-webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { 

-webkit-appearance: none;
}
fieldset { 

padding: .35em .625em .75em;
margin: 0 2px;
border: 1px solid #c0c0c0;
}
legend { 

padding: 0;
border: 0;
}
textarea { 

overflow: auto;
}
optgroup { 

font-weight: bold;
}
table { 

border-spacing: 0;
border-collapse: collapse;
}
td, th { 

padding: 0;
}
/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
@media print { 

*, *:before, *:after { 

color: #000 !important;
text-shadow: none !important;
background: transparent !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
a, a:visited { 

text-decoration: underline;
}
a[href]:after { 

content: " (" attr(href) ")";
}
abbr[title]:after { 

content: " (" attr(title) ")";
}
a[href^="#"]:after, a[href^="javascript:"]:after { 

content: "";
}
pre, blockquote { 

border: 1px solid #999;
page-break-inside: avoid;
}
thead { 

display: table-header-group;
}
tr, img { 

page-break-inside: avoid;
}
img { 

max-width: 100% !important;
}
p, h2, h3 { 

orphans: 3;
widows: 3;
}
h2, h3 { 

page-break-after: avoid;
}
select { 

background: #fff !important;
}
.navbar { 

display: none;
}
.btn > .caret, .dropup > .btn > .caret { 

border-top-color: #000 !important;
}
.label { 

border: 1px solid #000;
}
.table { 

border-collapse: collapse !important;
}
.table td, .table th { 

background-color: #fff !important;
}
.table-bordered th, .table-bordered td { 

border: 1px solid #ddd !important;
}
}
@font-face { 

font-family: 'Glyphicons Halflings';
src: url('../fonts/glyphicons-halflings-regular.eot');
src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
.glyphicon { 

position: relative;
top: 1px;
display: inline-block;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.glyphicon-asterisk:before { 

content: "\2a";
}
.glyphicon-plus:before { 

content: "\2b";
}
.glyphicon-euro:before, .glyphicon-eur:before { 

content: "\20ac";
}
.glyphicon-minus:before { 

content: "\2212";
}
.glyphicon-cloud:before { 

content: "\2601";
}
.glyphicon-envelope:before { 

content: "\2709";
}
.glyphicon-pencil:before { 

content: "\270f";
}
.glyphicon-glass:before { 

content: "\e001";
}
.glyphicon-music:before { 

content: "\e002";
}
.glyphicon-search:before { 

content: "\e003";
}
.glyphicon-heart:before { 

content: "\e005";
}
.glyphicon-star:before { 

content: "\e006";
}
.glyphicon-star-empty:before { 

content: "\e007";
}
.glyphicon-user:before { 

content: "\e008";
}
.glyphicon-film:before { 

content: "\e009";
}
.glyphicon-th-large:before { 

content: "\e010";
}
.glyphicon-th:before { 

content: "\e011";
}
.glyphicon-th-list:before { 

content: "\e012";
}
.glyphicon-ok:before { 

content: "\e013";
}
.glyphicon-remove:before { 

content: "\e014";
}
.glyphicon-zoom-in:before { 

content: "\e015";
}
.glyphicon-zoom-out:before { 

content: "\e016";
}
.glyphicon-off:before { 

content: "\e017";
}
.glyphicon-signal:before { 

content: "\e018";
}
.glyphicon-cog:before { 

content: "\e019";
}
}
/*# sourceMappingURL=bootstrap.css.map */

@font-face { 
font-family: "iconfont";
src: url('//at.alicdn.com/t/font_1191451_h720mljzrsc.eot?t=1567747578825'); /* IE9 */
src: url('//at.alicdn.com/t/font_1191451_h720mljzrsc.eot?t=1567747578825#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
url('//at.alicdn.com/t/font_1191451_h720mljzrsc.woff?t=1567747578825') format('woff'),
url('//at.alicdn.com/t/font_1191451_h720mljzrsc.ttf?t=1567747578825') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
url('//at.alicdn.com/t/font_1191451_h720mljzrsc.svg?t=1567747578825#iconfont') format('svg'); /* iOS 4.1- */
}
.iconfont { 

font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-address:before { 

content: "\e609";
}
.icon-user:before { 

content: "\e6a5";
}
.icon-password:before { 

content: "\e6a6";
}
.icon-logo:before { 

content: "\e6df";
}
.icon-all:before { 

content: "\e6fb";
}
.icon-shop:before { 

content: "\e6fe";
}
.icon-search:before { 

content: "\e6ff";
}
.icon-up-bracket:before { 

content: "\e70d";
}
.icon-down-bracket:before { 

content: "\e70e";
}
.icon-left-arrow:before { 

content: "\e711";
}
.icon-down-arrow:before { 

content: "\e712";
}
.icon-right-arrow:before { 

content: "\e713";
}
.icon-up-arrow:before { 

content: "\e714";
}
.icon-right-bracket:before { 

content: "\e716";
}
.icon-left-bracket:before { 

content: "\e600";
}
.icon-correct:before { 

content: "\e70f";
}
.icon-ios-add:before { 

content: "\e710";
}
.icon-delete:before { 

content: "\e715";
}
.icon-circle-delete:before { 

content: "\e717";
}
.icon-enlarge:before { 

content: "\e719";
}
.icon-lower-shelf:before { 

content: "\e71a";
}
.icon-upper-shelf:before { 

content: "\e71b";
}
.icon-download:before { 

content: "\e71c";
}
.icon-reverse-order-singer:before { 

content: "\e71d";
}

js部分源码：

$(document).ready(function(){ 
   
//加入时钟数字元素 
var list = "<li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li>";
var ool = "<ol>" + list + "</ol>";
$(".spot").after(ool);
//显示日期
var date = "<div class='date'></div>";
$(".spot").before(date);
//显示星期
var week = "<div class='week'></div>";
$(".date").before(week);
//显示年度
var year = "<div class='year'></div>";
$(".date").before(year);
//显示时间
var times = "<div class='times'></div>";
$(".date").before(times);
//春节倒计时
var starttime = new Date("2021/2/12");
setInterval(function () { 

var nowtime = new Date();
var time = starttime - nowtime;
var day = parseInt(time / 1000 / 60 / 60 / 24);
var hour = parseInt(time / 1000 / 60 / 60 % 24);
var minute = parseInt(time / 1000 / 60 % 60);
var seconds = parseInt(time / 1000 % 60);
var syday = "<span>" + hour + "</span>" + "小时" + "<span>" + minute + "</span>" + "分钟" + "<span class='Lose'>" + seconds + "</span>" + "秒";
$('.time').html("<p>除夕倒计时</p>" + "<p><span>" + day + "</span>" + "天</p>");
$(".sydate").html(syday);
}, 1000);
// 时钟走字方法
function Todayss(){ 

var day = new Date();  //日期
var Y = day.getFullYear();  //年
var M = day.getMonth() + 1;  //月
var D = day.getDate();  //日
var U = day.getUTCDay();  //周
var H = day.getHours();  //时
var MIN = day.getMinutes();  //分
var S = day.getSeconds();  //秒
var MSs = day.getMilliseconds();
var MS = MSs.toString().substring(0,2);
// 计算指针度数
var sss = S * 6,
mmm = MIN * 6 + (sss * 0.01),
hhh = (H * 30) + (MIN * 0.5);
var rotss = "rotate(" + sss + "deg)"; 
var rotmm = "rotate(" + mmm + "deg)";
var rothh = "rotate(" + hhh + "deg)";
$(".HH").css({ 
"transform":rothh});
$(".MM").css({ 
"transform":rotmm});
$(".SS").css({ 
"transform":rotss});            
// 小于两位数,保持两位
if(M < 10){ 
M = "0" + M;};
if(D < 10){ 
D = "0" + D;};
if(H < 10){ 
H = "0" + H;};
if(MIN < 10){ 
MIN = "0" + MIN;};
if(S < 10){ 
S = "0" + S;};  
switch (U){ 

case 0:U="星期日";
break;
case 1:U="星期一";
break;
case 2:U="星期二";
break;
case 3:U="星期三";
break;
case 4:U="星期四";
break;
case 5:U="星期五";
break;
case 6:U="星期六";
break;
};
//星期赋值
var week = U;
$(".week").html(week);
//年份赋值
var year = Y;
$(".year").html(year);
//日期赋值
var date = "<span>" + M + "</span>" + "月" + "<span>" + D + "</span>" + "日";
$(".date").html(date);
//时间赋值
var times = "<span>" + H + "</span>" + ":" + "" + "<span>" + MIN + "</span>" + ":" + "" + "<span>" + S + "</span>" + ":" + "" + "<span>" + MS + "</span>";
$(".times").html(times);
}
// Todayss();
setInterval(Todayss, 10);
// 发送弹幕
$(".message").click(function(){ 

$(".key").addClass("keys");
$(".key").removeClass("remove");
});
function Closs(){ 

$(".key").removeClass("keys");
$(".key").addClass("remove");
setTimeout(function(){ 

$(".key").removeClass("remove");
},1000);
};
$(".iocnBox").click(function(){ 

Closs()
});
$(".today").click(function(){ 

var ksyss = $(".key").hasClass("keys");
if(ksyss == true){ 

Closs()
}
});
var mess = "<span>没想到新年马上就要到了</span><span class='B-span2'>祝你我新年快乐！</span><span>你好2021新的一年。</span>";
$(".Barrage").append(mess);
$(".buts").click(function(){ 

var mes = $(".van-field__control").val();
if(!mes){ 

// alert("你还没输入内容呢!")
var Tipss = "<div class='Tipss'>主子，您还没输入内容呢</div>";
$("body").append(Tipss);
setTimeout(function(){ 

$(".Tipss").remove();
},1500)
}else{ 

//生成随机数: x上限，y下限 
var x = 10;
var y = 0;
var col = ["#3fd316","#0dd2ef","#ff0000","#3fd316","#0dd2ef","#ffffff","#3fd316","#0dd2ef","#ff0000","#3fd316"]; 
// 随机颜色
var colors = parseInt(Math.random() * (x - y + 1) + y);
// 随机高度
var rand = parseInt(Math.random() * (x - y + 1) + y) * 15;
// 随机速度
var sudu = parseInt(Math.random() * (x - y + 1) + y) * 3;
// 设置最低速度，禁止为0
if(sudu < 1){ 

sudu = 10;

HTML全部源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>你好——2021年 - 郑先生：www.shanezy.com</title>
<meta name="chenc" content="Runoob">
<meta name="description" content="时钟 时间 & 钟表 日历">
<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/font_1191451_h720mljzrsc.css">
<link rel="stylesheet" href="css/bootstrap.css">
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jweixin-1.4.0.js"></script> 
<script src="js/app.js"></script>
</head>
<body>
<div class="key">
<div class="iocnBox"><i class="iconfont icon-delete"></i></div>
<div class="empty">清空</div>
<textarea placeholder="在此述说新年寄语..." rows="1" class="van-field__control"></textarea>
<div class="buts">发送</div>
</div>
<div class="today">
<div class="clock">
<div class="pos SS"></div>
<div class="pos MM"></div>
<div class="pos HH"></div>
<div class="spot"></div>
</div>
<!-- <p>北京时间</p> -->
<!-- <div class="day"></div> -->
<div class="time"></div>
<div class="sydate"></div>
</div>
<div class="Barrage"></div>
<div class="message">发送弹幕</div>
<script src="js/snowy.js"></script>
<style type="text/css"> .snow-container{ 
position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100001;}</style>
<div class="snow-container"></div>
</body>
</html>

关注成为粉丝即可下载，无需积分！！
点击超链接：除夕倒计时Html文件以及源码

发布者：全栈程序员-用户IM，转载请注明出处：https://javaforall.cn/180384.html原文链接：https://javaforall.cn

【正版授权，激活自己账号】： Jetbrains全家桶Ide使用，1年售后保障，每天仅需1毛

【官方授权正版激活】： 官方授权正版激活支持Jetbrains家族下所有IDE 使用个人JB账号...

html网页动态日历代码_春节倒计时源码

点击文章下面超链接，即可免费下载，源码以及文件素材，无需积分，关注后即可下载

编码不易如有帮助到您请支持一下多谢

部分源码

发表回复

html网页动态日历代码_春节倒计时源码

点击文章下面超链接，即可免费下载，源码以及文件素材，无需积分，关注后即可下载

编码不易 如有帮助到您 请支持一下 多谢

部分源码

相关推荐

HeadFirstJava

数组类型的字符串转List<Map>

cuda安装错误_n卡图形驱动安装失败

maven阿里云仓库配置_阿里docker仓库

TCP拥塞控制算法（Tahoe/Reno/Newreno）

idea卸载删除旧版重新安装新版后，新版本idea程序打不开闪退的解决方案

发表回复

编码不易如有帮助到您请支持一下多谢