子化诗理-CSDN博客

原创移动端滑动时出现一段时间之后消失的提示性模块

2019-07-15 15:24:32 487

转载转载 [原生JS]实现移动端的上拉加载&下拉刷新

<body> <div id="app"> <header id="header"> <input type="text" id="input"> <input type="submit" id="submit"> </header> <article id="art...

2019-07-12 16:04:53 2250

原创 PC端页面切换成手机模式后，出行了一个莫名其妙的980px

移动端的默认布局视口宽一般是980px，所以body的100%才是980px。可以加这个<meta name="viewport" content="width=1200, initial-scale=1.0">

2019-07-03 16:18:42 1973

原创滑块横幅轮播

<div class="banner-wrap"><div class="cai-slider"><style>.banner-wrap{width: 1100px;height:300px;padding:0 10px;margin: 0 auto;margin-bottom: ...

2019-06-13 17:44:24 446

原创轮播插件

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X...

2019-04-25 15:31:47 711

转载 HTML meta标签总结与属性使用介绍

转：https://segmentfault.com/a/1190000004279791之前学习前端中，对meta标签的了解仅仅只是这一句。<metacharset="UTF-8">但是打开任意的网站，其head标签内都有一列的meta标签。比如我博客的。但是自己却很不熟悉，于是把meta标签加入了寒假学习计划的最前方。简介在查阅w3school中，第一句...

2019-04-19 14:44:05 166

原创替代即将淘汰的Flash

视频播放（Play Video）解决方案：在移动端设备上，使用HTML5的video标签基本没有问题。在PC上，IE低版本(IE8-)浏览器上除了Flash目前没有其它办法在PC上，IE9+和其它现在浏览器，采用HTML5标签。综合来说，可以统一用以下一段代码实现兼容：<video width="400" height="300" controld> &lt...

2019-02-15 15:54:58 2694

原创登录页表单验证

$(".login-btn").on("click", function () { return check() }) function check() {　　 var reg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-...

2018-07-06 13:58:21 1990

转载 JavaScript 实用窍门

1. 删除数组尾部元素一个简单方法就是改变数组的length值:const arr = [11, 22, 33, 44, 55, 66];// truncantingarr.length = 3;console.log(arr); //=> [11, 22, 33]// clearingarr.length = 0;console.log(arr); //=> []console.lo...

2018-06-22 16:52:03 264

原创原生JS实现移动端判断滑动到底部还是顶部并实现懒加载功能

window.onscroll = function () { var scrollT = document.documentElement.scrollTop || document.body.scrollTop;//滚动条的垂直偏移 var scrollH = document.documentElement.scrollHeight...

2018-06-20 10:01:09 5116 1

原创带回车的字符串实现段落区分和展开、收起（默认收起）功能

1、段落区分利用正则表达式 .replace( /(^\s*)|(\s*$)/g,"")将带回车的字符串按段落分开，放入p标签里，最后一段用span包裹。2、展开收起功能function init() { var wordsNum = 60; //默认显示字数 var ctn = document.getElem...

2018-06-20 09:43:25 305

/* 封装ajax函数 * @param {string}opt.type http连接的方式，包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @param {boolean}opt.async 是否为异步请求，true为异步的，false为同步的 * @param {object}opt.data 发送的参数，格式为对象类型 * @param...

2018-06-11 14:43:19 493

原创 vue 的点击事件怎么获取当前点击的元素

首先 vue的点击事件是用 @click = “clickfun()” 属性在html中绑定的,在点击的函数中添加$event 参数就可以比如<button @click = “clickfun($event)”>点击</button>methods: { clickfun(e) { // e.target 是你当前点击的元素 // e....

2018-05-14 16:00:35 48519

转载常用代码片段中整理

//1. 检查图像是否加载完毕 $('img').load(function () { console.log('image load successful '); }); //2. 悬停切换 $(seletor).hover(function () { $(...

2018-05-14 10:35:37 215

原创 Vant安装和使用

Vant ( ˈvænt ) 是有赞前端团队基于有赞统一的规范实现的 Vue 组件库，提供了一整套 UI 基础组件和业务组件。通过 Vant，可以快速搭建出风格统一的页面，提升开发效率。目前已有近50个组件，这些组件被广泛使用于有赞的各个移动端业务中。如果你需要开发一个移动商城，用 Vant 就再合适不过了。中文文档链接：https://www.youzanyun.com/zanui/vant#/...

2018-05-11 10:45:15 75779 15

原创用 font-size：0来清除inline-block元素之间的间距

inline-block的元素之间会受空白区域的影响，也就是元素之间差不多会有一个字符的间隙。如果在同一行内有4个25%相同宽度的元素，会导致最后一个元素掉下来（如图）。你可以利用元素浮动 float，或者压缩html，清除元素间的空格来解决。但最简单有效的方法还是设置父元素的 font-size属性为 0。...

2018-05-10 09:08:18 894

原创 ECMAScript6.0（ES6）笔记整理

ECMAScript6（简称ES6）是 JavaScript 语言的下一代标准。在2015年6月正式发布，所以又称ES2015。由于目前并不是所有浏览器都能兼容 ES6 全部特性，但是 ES6 在实际项目中的广泛使用已成为一种趋势。所以作为一个前端开发者，ES6 的语法是我们必须掌握的。Babel是一个广泛使用的ES6转码器，可以将ES6代码转为ES5代码，从而在现有环境执行。Babel官网 (h...

2018-05-08 11:28:17 442

转载 editplus5激活码,亲测有效！

editplus5激活码name: Vovancode: 3AG46-JJ48E-CEACC-8E6EW-ECUAW

2018-05-07 14:33:28 12743 8

原创性能优化——for循环

通过时间复杂度O(n)判断是否优化成功。提到时间复杂度，第一时间想到的是算法，简单说，算法就是你解决问题的方法，而你用这个方法解决这个问题所执行的语句次数，称为语句频度或者时间频度，记为T(n)。那么问题来了，我们为什么要引入这些个概念呢。因为我们想要的是执行一个算法耗费的时间，这个时间理论上可以得到，但是，要得到这个时间就必须要上机测试，但是有这个必要吗？我们需要知道的是哪一个算法需要的时间多，...

2018-05-07 14:13:35 4064

原创移动端适配的解决方案—rem

rem（font size of the root element）是相对长度单位。相对于根元素（即html元素）font-size计算值的倍数。方案一、固定换算倍数100设置rem，实现的效果是在PC端浏览器里不用点击toggle device toolbar(切换设备工具栏)也可以和移动端屏幕基本一致的效果体验，设置的默认宽度为750px（可以根据你的图纸修改默认宽度），在默认屏幕宽度下1re...

2018-04-27 11:18:14 1805

原创判断页面的打开方式是安卓还是IOS,是微信还是其他浏览器，并执行不同的跳转

$.ready = function () { var urlpath = location.search.slice(1);// 根据地址栏id信息判断下载那个app if (getUrlArguments("id") == 1 || getUrlArguments("id") == null) { $('title').text("空间微信-世界大学城"); //改...

2018-03-01 10:12:05 1326

原创 eCharts使用总结：属性解释+修改+效果展示+多个图表切换

最近做统计图表使用的是echarts插件，简单解释一下用到的每个配置项是干什么用的，以及效果展示在什么位置；实现了多个图表切换的功能；本人是入门级小白，有什么错误的地方请大神指示，最全最详细的解释还是去看官网的配置吧！配置项都在这里了http://echarts.baidu.com/option.html#title，function weekSumShow (){ v

2018-01-25 11:24:44 14391 2

转载转载：Echarts - legend属性设置

legend: { orient: 'horizontal', // 'vertical' x: 'right', // 'center' | 'left' | {number}, y: 'top', // 'center' | 'bottom' | {number} backgroundColor: '#fff',

2018-01-24 15:53:15 2670

原创滑轮滑动+小圆点触发全屏上下滚动并实现不同浏览器窗口下的缩放

css准备：模块宽度设置为100%；高度设置为100vh；内容区域设置为1000*800，居中显示；js:$(function(){ //初始化页面置于顶部 $("html,body").animate({scrollTop:0},300); var page = 0; //浏览器当前窗口可视区域宽度 var viewWidth=$(window).

2017-11-21 13:53:22 1041

转载面向对象三大基本特性,五大基本原则

透切理解面向对象三大基本特性是理解面向对象五大基本原则的基础.三大特性是：封装,继承,多态所谓封装，也就是把客观事物封装成抽象的类，并且类可以把自己的数据和方法只让可信的类或者对象操作，对不可信的进行信息隐藏。封装是面向对象的特征之一，是对象和类概念的主要特性。简单的说，一个类就是一个封装了数据以及操作这些数据的代码的逻辑实体。在一个对象内部，某些代码或某些数据可以是私有

2017-11-10 11:10:06 248

原创把二维数组转换为json字符串

var data = [ ['选项1', 10], ['选项2', 10], ['选项3', 50],['选项4', 30] ];var oneArr=[].concat.apply([],data);//["选项1", 35, "选项2", 15, "选项3", 25, "选项4", 25]var jsonArr=[];var nameArr=[];for(var i=0;ioneAr

2017-11-09 17:16:11 6550

原创这个是Ueditor编辑器吗？

第一行测试文字凄凄切切群群群群群群群群群群群群群第二行测试文的是放到第四季度好借口不第三行测试文字文字色淡淡道多多多多多第二行测试文的是放到第四季度好借口不第三行测试文字文字色淡淡道多多多多多第一行测试文字凄凄切切群群群群群群群群群群群群群第一二行间距比较大！

2017-10-26 14:53:45 256

原创 mouseout 和 mouseleave 之间的一些不同

mouseout：如果移出被选取的元素时，就会触发mouseout,包括移动到其子元素也会触发；常与mouseover搭配使用；mouseleave:同样也是移出被选取的元素时会触发mouseleave,但不包括其子元素，所以除非移出被选取元素范围，不然都不会触发mouseleave，常与mouseenter搭配使用；

2017-10-17 09:13:29 555

原创利用jquery的animae属性优化锚点跳转太快的问题

1、声明跳转函数(可改变跳转时长)function jump(sel) { $("html,body").animate({ scrollTop: $(sel).offset().top }, 800);}2、点击标签调用跳转函数$(".btn").on("click", function () { jump("#title");});

2017-09-27 16:29:49 2395

原创 table表格的相关设置（边框合并、隔行变色、添加内边框、单独设置某一列）

1、为table表格设置边框合并table{ border-collapse:collapse; border-spacing:0;}2、隔行变色和添加内边框function addColor() { var tbodyTrList = $(".table tbody tr"); var tdList = $(".table td");

2017-09-27 15:08:43 4907

原创使用js将多个相关联的excel数据文件整合到一起并筛选出需要的数据的整理

最近，因为业务需要遇到一个整合筛选excel数据的项目。两个excel文件，一个是按获奖人名整理的获奖数据（分老师和学生两种身份，获奖类型分一、二、三等奖），另一个是按报送学校整理的数据（学校类型分为高职和中职），报送的学校要比获奖的学校个数多，业务需求是按学校类型统计获奖学校的老师和学生每一个获奖类型的个数。首先推荐一个把excel转为json的在线网站 http://www.bejso

2017-09-27 09:24:11 2184

原创 IE浏览器下点击a标签有虚线框的问题

IE浏览器下点击a标签会出现虚线框，查阅相关资料之后将解决方法记录一下：去除a链接虚线框方法是：ie下用hidefocus属性：‘ hidefocus=”true” ’Chorme/Opera/Safari下使用：outline:none。例如: 链接a:focus {outline-style:none; -moz-outline-style: none;}

2017-09-14 15:35:29 1179

原创运行一个从GitHub上下载的vue项目的具体步骤

1.首先获取到设置信息2.找到克隆的路径（本步骤不包含下载.zip的方法）3.打开 Git Shell ->输入： cd ../../->输入： cd 想要安装的路径 ->输入：git clone https://github.com/Sioxas/vue-music.git->回车4.输入：cd vue-music(文件名称) ->回车5.参

2017-07-13 21:15:38 21717

原创使用bootstrap引起IE浏览器滚动条变为透明的并且不占用页面宽度的问题以及解决办法

找到html标签，添加css属性：html {/*始终显示滚动条*/-ms-overflow-style:scrollbar;}

2017-07-12 17:14:32 1683

转载常见的前端面试题（含答案）

一般问题你用Twitter吗？（在天朝最好问你用微博吗？）如果用，你都关注那些人？关注了几个前端大牛、高中同学、电影和旅行。你用Github吗？如果用，你关注的项目有什么？还没，看来要关注一下了。你关注的博客有那些？没有专门去关注谁，有技术问题和闲暇会翻一翻，看来也要关注一下了。你使用那些版本管理系统，比如Git，SVN等？vss、svn、

2017-07-12 13:29:07 814

webFront的博客