html
静静静静静rj
这个作者很懒,什么都没留下…
展开
-
html: 404界面
body<div class="figure"> <div class="mj"> <div class="head"> <div class="nose"></div> <div class="hair"> <div class="ponytail"></div> <div class="frontpony"></...原创 2020-05-19 09:10:41 · 1467 阅读 · 0 评论 -
html+css: 打招呼的卡比兽动画
body<div class="snorlax"> <div class="snorlax__head"> <div class="snorlax__head-outline"></div> <div class="snorlax__ear snorlax__ear--left"></div> <div class="snorlax__ear snorlax__ear--right">...原创 2020-05-19 09:03:23 · 694 阅读 · 0 评论 -
html+css: 西瓜时钟
body 中<div class="wrapper"> <div class="face"> <div class="seeds"> <div></div> <div></div> <div></div> <div></div> <div></div> <...原创 2020-05-19 08:59:51 · 424 阅读 · 0 评论 -
html+css: 小狗动画
body<div class="main"> <div class="dog"> <div class="dog__paws"> <div class="dog__bl-leg leg"> <div class="dog__bl-paw paw"></div> <div class="dog__bl-top top">...原创 2020-05-19 08:55:44 · 1192 阅读 · 0 评论 -
html+js: 小猫眼睛跟随鼠标移动
body中<svg viewBox="0 0 493 470" fill="none" xmlns="http://www.w3.org/2000/svg"> <circle class="pupil" cx="301.377" cy="120.203" r="25" fill="black"></circle> <circle class="pupil" cx="410.549" cy="120.203" r="25" fill="black"...原创 2020-05-19 08:52:55 · 2683 阅读 · 0 评论 -
html+css+js:粒子束
body中<canvas id="canvas">Canvas not supported.</canvas>css* { margin: 0; padding: 0;}canvas#canvas { display: block; background: #000;}js(function() { 'use strict'; window.addEventListener('load', function(...原创 2020-05-15 11:56:31 · 298 阅读 · 0 评论 -
html+js:雪花飘落背景2(六瓣,非图片方式)
在html中加入 js代码<script type="text/javascript">/*样式一*///背景雪花飘落特效(function($){ $.fn.snow = function(options){ var $flake = $('<div id="snowbox" />').css({'position': 'absolute','z-ind...原创 2020-05-04 14:05:42 · 566 阅读 · 2 评论 -
樱花旋转
css/*樱花旋转*/@font-face {font-family: "iconfont"; src: url('//at.alicdn.com/t/font_679578_qyt5qzzavdo39pb9.eot?t=1527145839653'); /* IE9*/ src: url('//at.alicdn.com/t/font_679578_qyt5qzzavd...原创 2020-04-30 15:18:34 · 7622 阅读 · 0 评论 -
输入框礼花特效
input.js(function webpackUniversalModuleDefinition(root,factory){if(typeof exports==='object'&&typeof module==='object')module.exports=factory();else if(typeof define==='function'&&...原创 2020-04-30 08:43:36 · 188 阅读 · 0 评论 -
html+js:页面鼠标单击--------烟花爆炸效果2
<!-- 点击爆炸效果--><canvas class="fireworks" style="position: fixed; left: 0px; top: 0px; z-index: 1; pointer-events: none; width: 1440px; height: 451px;" width="2880" height="902"></canva...原创 2020-04-28 10:32:23 · 1446 阅读 · 1 评论 -
html+css:浏览器页面title隐藏显示
示例如图离开页面时 客官请留步回到页面时 你终于回来啦3秒钟之后 显示XXX的博客将代码插入html中<script type="text/javascript" language="javascript">var time;var nor...原创 2020-04-27 15:40:43 · 1656 阅读 · 0 评论 -
html页面鼠标单击----------爱心特效
直接将以下代码复制到html中即可。<script type="text/javascript"> !function (e, t, a) {function r() {for (var e = 0; e < s.length; e++) s[e].alpha <= 0 ? (t.body.removeChild(s[e].el), s.splice(e, 1))...原创 2019-10-31 13:57:30 · 4484 阅读 · 0 评论 -
html+js:页面鼠标单击----------烟花爆炸特效1
<script src="https://blog-static.cnblogs.com/files/zouwangblog/mouse-click.js"></script><canvas width="1777" height="841" style="position: fixed; left: 0px; top: 0px; z-index: 21...原创 2020-04-27 13:43:50 · 2052 阅读 · 0 评论 -
html+js:鼠标跟随控制飞机方向
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do...原创 2020-04-23 15:09:35 · 343 阅读 · 0 评论 -
html+css:鼠标跟随特效气泡3
示例见图<!DOCTYPE html><html lang="en" class="no-js"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="...原创 2020-04-27 13:28:40 · 409 阅读 · 0 评论 -
html+css:鼠标跟随特效气泡2
图示见下<!DOCTYPE html><html lang="en" class="no-js"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="...原创 2020-04-27 13:25:49 · 323 阅读 · 1 评论 -
html+css:折扇效果
body中<div class="box"> <div>作赋凌相如</div> <div>十五观奇书</div> <div>深藏身与名</div> <div>事了拂衣去</div> <div>千里不留行</div> ...原创 2020-04-28 17:03:47 · 912 阅读 · 0 评论 -
html+JS:爱心鼠标跟随特效
截图工具截不到鼠标。。。body中加入<span class="heart-eye"> <span class="heart"></span></span>css样式.heart-eye { position:absolute; animation:pulse 1s ease-out infi...原创 2020-04-24 17:22:27 · 1148 阅读 · 1 评论 -
html+CSS样式:雪花飘落背景(雪花为图片)
多种雪花图片,自由下落到底端渐变消失<!DOCTYPE html><html style="background-color: black"><head> <meta charset="UTF-8"> <title>雪花飘落</title> <meta content='wid...原创 2020-04-08 11:45:44 · 6182 阅读 · 4 评论 -
html+css样式:图片切换-----立体旋转
html如下:<!DOCTYPE html><html lang="zh"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="view...原创 2020-04-14 09:17:43 · 1170 阅读 · 0 评论 -
html与jsp区别
一、静态web页面,一般指html:1、在静态Web程序中,客户端使用Web浏览器(IE、FireFox等)经过网络(Network)连接到服务器上,使用HTTP协议发起一个请求(Request),告诉服务器我现在需要得到哪个页面,所有的请求交给Web服务器,之后WEB服务器根据用户的需要,从文件系统(存放了所有静态页面的磁盘)取出内容。之后通过Web服务器返回给客户端,客户端接收到内容之后经...转载 2020-04-09 13:07:31 · 417 阅读 · 0 评论 -
html+CSS+JS:点击Button样式
左键单击按钮:从左及右以各种形状粒子形式扩散消失1>2>3>4>5>还有好多。。。我懒得截图了,自己看去吧。。(以前看别人写的分享博客,总希望笔者再多写点,再详细一点,甚至有时内心小些埋怨怎么写这么点,到底讲了个啥~~~~终于有一天自己也开始尝试走向分享这条道路,发现...原创 2020-04-08 11:28:05 · 2452 阅读 · 0 评论 -
前端html+css: 3D滚动正方体————按住鼠标左键即可拖动
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> h3{ text-align: center; color: #5A5A5A;} body{...原创 2020-04-08 10:38:57 · 1488 阅读 · 1 评论