前端_js_案例
文章平均质量分 71
心郎
目标的不可更改 就决定了手段的多种选择
展开
-
上传视频截取第一贞 转图片
<!--* @Author: Mr.xie* @Date: 2021-09-13 19:22:51* @LastEditTime: 2021-09-14 19:51:13* @LastEditors: Mr.xie* @Description:* @FilePath: /vido/updateVide.html* 可以输入预定的版权声明、个性签名、空行等--><!DOCTYPE html><html lang="en">原创 2021-09-14 19:57:26 · 243 阅读 · 0 评论 -
原声js 模拟微信滑动
微信滑动删除 --> *{ padding: 0; margin: 0; } html { font-size: 20px; } body { font-size: 16px; } @media only screen and (max-width: 320px) { html {原创 2017-06-05 21:13:30 · 477 阅读 · 0 评论 -
js table栏切换+border绘制三角形特殊应用
*{ margin: 0; padding: 0; } body{ width: 100%; height: 100%; background-color: #f6f6f6; } .count{ width: 390px; height: 444px; /*border: 1px原创 2017-06-05 21:18:02 · 1605 阅读 · 0 评论 -
jq + qrcode 生成二维码(解决中文乱码)
生成二维码 var str= "阿斯达四大四大1|9131000030150590X2|中国(上海)自阿斯达四大四大号302部位368室|021-58388909|中信银行股份有限公司上海长宁支行|7312410182600061061"; // function utf16to8(str) { var out, i,原创 2017-06-05 21:35:35 · 10529 阅读 · 0 评论 -
原声js 图片上传并预览
图片上传预览 function imgPreview(fileDom){ //判断是否支持FileReader if (window.FileReader) { var reader = new FileReader(); } else { alert("您的设备不支持图片预转载 2017-06-05 21:41:03 · 434 阅读 · 0 评论 -
H5 移动端进度条加载
移动端进度条 html { font-size: 20px; } body { font-size: 16px; font-family: "微软雅黑"; } @media only screen and (max-width: 320px) { html { font-size: 42.7px原创 2017-08-22 11:11:17 · 3227 阅读 · 0 评论 -
h5 游戏 黑白格
有个bug你是否能帮助找出并修改 .move_info{ height:5000px; width: 100%; } .move_info div{ float: left; width: 33.33%; } .alert_box{ position: fixed; top: 0; left:原创 2017-08-24 11:34:46 · 887 阅读 · 0 评论 -
文本框textarea根据输入内容自适应高度
demo演示地址:http://www.xuanfengge.com/demo/201308/textarea/demo2.html这个写法是用原生JS写的,考虑了很多兼容性问题,完全和新浪微博的回复效果一样的功能。有兴趣的童鞋可以仔细分析下代码。<!DOCTYPE html><html><head> <meta charset="utf-8"...转载 2018-07-06 14:13:54 · 2962 阅读 · 1 评论 -
js 年月之间差值 集合
<!-- 取 年月之间差值 集合--> <script> var firstYear = '201609'; var lastYear = '201910'; //共几年 var chaYear = parseInt(lastYear.slice(0,4)) - parseInt(firstYear.slice(0,4)) +1 ;...原创 2018-11-24 18:36:46 · 306 阅读 · 0 评论 -
js 统计网站停留时间
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>统计网站停留时间</title> <script src="js/jquery-1.11.3.min.js"></script转载 2018-12-05 15:00:37 · 1959 阅读 · 0 评论 -
js 浏览器到底部添加数据
li{ height: 100px; line-height: 100px; width: 200px; margin: 0 auto; border: 1px solid chartreuse; background-color: #000000; text-align: center; color: chartreuse; box-sizi原创 2017-04-02 14:35:39 · 704 阅读 · 0 评论 -
js template-natice 模板
功能 管理我的群 管理我的群 var token = window.sessionStorage.getItem("token"); var http = window.sessionStorage.getItem("http"); $.ajax({ type: "POST",原创 2017-04-01 12:27:47 · 376 阅读 · 0 评论 -
js案例-1 模拟百度搜索
* { padding: 0; margin: 0; } .box { width: 500px; margin: 200px auto; } ul { width: 392px; paddi原创 2016-09-04 19:49:46 · 1449 阅读 · 0 评论 -
js案例-2 左右select栏目内容互换
左右select栏目内容互换原创 2016-09-04 20:16:54 · 1502 阅读 · 0 评论 -
js案例-3 复选框checkbox的全选返回控制
复选框checkbox的全选 反选 控制原创 2016-09-04 23:48:15 · 509 阅读 · 0 评论 -
js案例-5 隔行变色高亮
隔行变色高亮原创 2016-09-05 08:31:13 · 413 阅读 · 0 评论 -
js案例-4 经典tab栏切换
经典tab栏切换 标题改变 子栏目也对应改变原创 2016-09-04 23:54:10 · 1991 阅读 · 0 评论 -
js案例 元素的拖拽与吸附(touch+translate)
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale...原创 2016-11-29 14:03:42 · 6953 阅读 · 2 评论 -
js案例 移动端左右滑动touch+transform
*{ padding: 0; margin: 0; /*margin-top:100px;*/ } #move{ height: 80px; width: 99%; border: 1px solid red; font-size: 19px; text-align: center; padding-top: 20原创 2016-11-29 22:44:56 · 11193 阅读 · 0 评论 -
js 案例 文本框简单校验
a{ color: darkgrey; } input{ color: lightgrey; } .hide { display: none; } .show { display: block; } #lab1 {原创 2016-11-23 23:23:47 · 355 阅读 · 0 评论 -
js 登陆ajax请求
#login{ margin: 150px auto; list-style: none; border-radius: 30px; } #login{ width: 500px; height: 300px; border: 1px solid cornflowerblue; } #userName{ positio原创 2017-04-01 12:26:38 · 3388 阅读 · 0 评论 -
js 案例-6 无缝轮播图
无缝轮播图原创 2016-09-09 23:22:58 · 2592 阅读 · 0 评论