
前端
文章平均质量分 59
little_蔷薇
敲代码贼HAPPY。
展开
-
仿有赞自定义魔方密度的实现
仿有赞自定义魔方密度的实现魔方密度是自定义的,比如5x5,6x6,7x7,9x9。然后用户可以自定义操作,用户自己去定义组合魔方密度的小魔方。小程序端或者h5端呈现相应的效果。这次我们主要写小程序端和h5的呈现效果。计算方式那相当于只能用定位来实现,需要知道每个盒子的top,left,width,height 。话不多说,具体代码如下 // 自定义魔方盒子计算宽高 let midu = 7 //mifu是一行有几个格子,假设是7*7 let a //原创 2021-11-10 15:59:58 · 404 阅读 · 0 评论 -
flex布局出现bug的解决方法
(1)使用flex-basis出现bug <style> .big{ width: 400px; height: 100px; background-color: lightcoral; margin:0 auto; display:flex; ...原创 2018-06-05 15:14:08 · 3269 阅读 · 1 评论 -
mui框架内容区域滚动部分详解注意事项
(1)下拉刷新完成后要结束下拉刷新 不仅要渲染页面还需要调用结束下拉刷新的方法mui('.mui-scroll-wrapper').pullRefresh().endPulldownToRefresh();(2)上拉加载提示没有数据的时候 如果下拉刷新需要再次能够上拉加载 在下拉刷新的回调函数还需要重置上拉加载mui('.mui-scroll-wrapper').pullRefresh().ref...原创 2018-06-12 22:29:41 · 6278 阅读 · 0 评论 -
模板字符串(artTemplate)
1. 需要循环遍历 生成模板 需要使用循环的代码 循环的数据就是当前API返回数据里面要循环遍历的数据当前API的数据rows value就是循环的每一个值 数组里面的每一个值相当于rows[i] {{each 循环的数组 as value i}} {{/each}} {{each rows as v...原创 2018-06-12 22:47:50 · 1231 阅读 · 0 评论 -
localStorage与sessionStorage的使用
// 获取本地存储已经存储的值,这里的值是一个字符串 var arr = window.localStorage.getItem('searchData'); console.log(arr); // 判断当前arr是否有值,如果有值,转为数组,如果没值,转为空数组,遍历存有本地数据的数组,查找需要存储的内容是否已经在这个数组中,如果没有,就加进去,如果有,就不管 if(arr.leng...原创 2018-06-11 09:29:37 · 171 阅读 · 0 评论 -
IE盒模型和W3C盒模型
1.什么是盒模型? 盒模型的组成:padding+border+content+margin。 有两种盒模型,一种是标准(W3C)盒模型,它的宽高:content 一种怪异(IE)盒模型,它的宽高:padding+border+content2.怎么设置盒模型? box-sizing:border-box; //IE盒模型 bo...原创 2018-06-11 10:21:21 · 308 阅读 · 0 评论 -
js设计模式---状态模式
Success doesn't just find you. You have to go out and get it.状态模式的关键是区分事物内部的状态,事物内部状态的改变往往会带来事物的行为改变。故事背景:我们来想象这样一个场景:有一跟水管,水管上面只有一个水龙头。当有水流出的时候,此时拧一下水龙头,水不会流出来;再拧一次开关,水又会流出来;同一个水龙头,在不同的状态下,表...原创 2019-08-29 11:16:07 · 106 阅读 · 0 评论 -
字符串的常用方法
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>标题</title> <script> //字符串常用方法:不管是那个字符串方法,都不会改变原来的字符串,因为字符串原创 2018-05-16 14:37:46 · 557 阅读 · 1 评论 -
jQ实现机械表
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> .clock { width: 600原创 2018-05-16 14:34:40 · 204 阅读 · 0 评论 -
呼吸轮播图
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>动画-案例《轮播图》</title> <style> * { margin: 0原创 2018-05-16 13:21:28 · 338 阅读 · 0 评论 -
使用session解决页面刷新
需求:一个有提交内容的页面,使用session来存取的值。因为session的id值,要刷新页面才会改变,所以需要修改session值。解决方案:提交的时候重新设置session。在我的代码里,我是重新设置了$_SESSION['data'],就不需要刷新页面,点击提交就可以进行接下来的操作。$_SESSION['data'] = my_SELECT("select * from users wh...原创 2018-05-14 14:49:38 · 9267 阅读 · 0 评论 -
使用URL.createObjectURL图片选择预览
<h2> <input type="file"> <img src="../img/a.png" id="one" alt></h2>选择文件之后,根据文件来生成地址。这个url能够被对应的标签识别,把这个url的值赋给img的src。$("input").on("change",fun原创 2018-05-14 15:10:31 · 2493 阅读 · 0 评论 -
jQuery封装init
var quickExpr = /^[^<]*(<(.|\s)+>)[^>]*$|^#(\w+)$/;以上这个是一个检测HTML字符串和ID字符串的简单正则判断方法。 实例:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">原创 2018-05-15 21:57:23 · 772 阅读 · 0 评论 -
模板引擎渲染页面
①导入模板引擎②定义模板③挖坑④起名字⑤填坑⑥使用举例如下: <!-- 导入模板引擎 --> <script src="../assets/vendors/art-template/template-web.js"></script> <!-- 定义模板 --> <script type="text/html" id="cate原创 2018-05-16 09:57:47 · 1298 阅读 · 0 评论 -
批量操作的checkbox选中状态
<table class="table table-striped table-bordered table-hover"> <thead> <tr> <th class="text-center" width="40"> &a原创 2018-05-16 10:10:23 · 1890 阅读 · 0 评论 -
ajax2.0获取表格数据提交到服务器
$('form button.btn-primary').click(function(event){ event.preventDefault(); // ajax新增即可 // form表单中 // 自动格式化form表单中的数据 var sendData = new FormData(document.querySelector('form...原创 2018-05-16 10:29:26 · 428 阅读 · 0 评论 -
jQ事件操作
页面上有一个div标签,需要给他绑定很多事件。可以用on来进行绑定。$('div').on({ click: function () { console.log('你点我啦'); }, mouseenter: function () { ...原创 2018-05-16 12:53:08 · 264 阅读 · 1 评论 -
jQ动画队列
$('input').first().click(function () { // 每次点击 // 增加 2个动画 // 多次点击 会增加 次数*2个动画 // 可以想象为 一个数组 // 每次增加两个元素 // jQ...原创 2018-05-16 13:07:12 · 758 阅读 · 0 评论 -
Jquery的各种高度
$(document)和$(window)①$(doucment).height():整个网页的高度②$(window).height():浏览器可视窗口的高度③$(window).scrollTop();//浏览器可视窗口顶端距离网页顶端的高度(垂直偏移)例如:当网页滚动条拉到最低端时,$(document).height() == $(window).height() + $(window)....转载 2018-05-14 10:30:29 · 1126 阅读 · 0 评论