追梦&天空的博客

圆环HTML结构配置。

HTML5中新增了“应用程序缓存”，允许Web应用将应用程序自身本地保存到用户的浏览器中。不像localStorage和sessionStorage只是保存Web应用程序相关的数据，它是将应用程序自身保存起来–应用程序所需要的运行的所有文件（HTML、CSS、JavaScript、图片等）。“应用程序缓存”和一般的浏览器缓存不同：它不会随用户清除浏览器缓存而被清除。同时缓存起来的应用程序也不会像一般固定大小的缓存那样，老数据会被最近一次访问的新数据代替掉。它其实不是临时存储在缓存中：应用程序更像是被“安装

常见的表格数据结构目录常见的表格数据结构第一种表格数据结构第二种表格数据结构第三种表格数据结构第一种表格数据结构<template></template>// javascriptexport default { name: 'app', data () { return { data: [ ...

前端JS实现图片质量压缩用户在选择图片文件进行上传的时候是不会考虑文件的大小的，比如场景：某用户只是想更换一下自己的用户头像，于是用自己的手机拍了一张照片，上传到应用中更换用户头像，然而现在的手机拍照功能保存的图片大多都超过3MB，而头像只是一个占用空间很小的显示区域，所以上传一个很大的图片会浪费资源和消耗不必要的性能目的：降低流量的消耗 降低http请求性能消耗 降低服...

动态楼层导航目录动态楼层导航页面布局数据模型滚动事件监听监听窗口滚动楼层导航动态定位设置楼层导航事件驱动方法设置楼层向上滚动设置楼层向下滚动完整代码在vue中使用v-for动态渲染楼层和楼层导航，然后使用原生JavaScript实现楼层导航动态更新与楼层滚动定位１、页面初始化时定位首个楼层２、页面滚动楼层导航自动定位到相应的楼层并高亮显示３、...

vue中使用laydate时间插件之前在做vue项目时使用iviewUI库中的DatePicker组件，发现DatePicker使用起来比较麻烦，尤其是对时间精确度上的限制不尽人意，操作起来也比较繁琐，总之在处理一系列时间组件相互联动上存在一大堆问题，比如DatePicker时间组件时间精确到分，组件1的value等于组件2的最小值，组件2的vlaue等于组件3的最小值，。。。依次类推，如...

HTML5笔记1、什么是标签语言？标签语言也被称为标记语言或者置标语言。标签语言是由一些标识码或控制标签组成。2、标签语言有哪几类？标签有两类：Ａ：专门用途的标签语言Ｂ：一般通用的标签语言HTML就是一种专门用途的标签语言，定制HTML既是为了将文档数据以不同的方式显示在浏览器这个应用软件中。3、设计HTML的目的是什么？设计HTML有两个目的，分别是：...

 JavaScript的FormData+Ajax实现文件上传+图片上传在很多网页开发中会存在文件上传，图片上传的操作，有的使用form表单默认功能提交文件，有的采用Ajax提交如果采用form表单的提交方式，恰恰又需要添加额外的参数或者需要设置特定的请求头信息，那么这种方式就显得有些单调了以下采用第二种方式：采用JavaScript+Ajax来实现文件上传如果希望在选择文件确认...

填写表单分步步骤进度条使用原生JS实现填写表单分步步骤进度条效果图如下所示：步骤进度条&lt;div id="step"&gt; &lt;div class="step-wrap"&gt; &lt;div class="step-bg"&gt;&lt;/div&gt; &lt;div class="step-pro

自定义封装时间轴纵向滚动时间轴滚动以前没写过，今天写着玩，只实现了鼠标纵向滑动时间轴的效果，暂时没做三列联动效果效果图如下：鼠标纵向滚动时间轴具体实现的代码如下：&lt;div id="container"&gt; &lt;div id="select"&gt;&lt;/div&gt; &lt;div class="year column"&gt;&lt;

原生封装自定义滚动条有时候在开发过程中，为了一些美化效果，往往需要修改浏览器上一些默认的样式或者事件，让整个页面看起来更和谐，舒畅。比如在开发过程中就遇到修改该浏览器默认滚动条的需求，当然使用CSS的伪元素也可以修改浏览器滚动条的默认样式，但是存在兼容性问题，由于各大浏览器厂商对浏览器的设计略有不同，比如说浏览器内核，再加上浏览器高低版本的兼容，所以实现出来的效果并不尽人意。下面是针对...

CSS实现盒子模型水平居中、垂直居中、水平垂直居中的多种方法CSS实现盒子模型水平居中的方法水平居中效果图水平居中全局样式.parent { color: #FFFFFF; height: 200px; width: 200px; margin: 0 auto; background-color: #000000;}.child {...