栏目: CSS/HTML

OpenLayers基础教程—点要素图层的聚合显示

1、在很多情况下,点要素图层中的要素数量可能会成百上千,这时候如果不做任何处理直接加载到地图上不仅会使用户视觉体验下降,而且也会造成地图界面的卡顿。下面这段代码创建了1000个随机点进行显示:OpenLayershtml,body,#map{width:100%;height:100%;margin...

2021-09-15 62 0 0 阅读全文

ClientX、OffsetX、ScreenX、PageX区别

开发中我们是离不开事件的,有关鼠标的事件就会牵扯到event对象,其中就包括了各种X、Y的值,区别他们最直接的就是看图。screenX、screenYscreenX设置或获取获取鼠标指针位置相对于电脑屏幕的x坐标screenY设置或获取鼠标指针位置相对于电脑屏幕的y坐标offsetX、offsetY...

2021-09-15 61 0 0 阅读全文

Flex布局总结

最近在写移动端项目,想着把flex布局,重新梳理一遍,总结下。参考地址:www.runoob.com/w3cnote/fle…flex布局Flex是FlexibleBox的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。Webkit内核的浏览器,必须加上...

2021-08-07 119 0 0 阅读全文

推荐一个好看Table表格的Css样式代码详解

漂亮的table表格样式css源码漂亮的table表格样式源码table{border-collapse:collapse;margin:0auto;text-align:center;}tabletd,tableth{border:1pxsolid#cad9ea;color:#666;height...

2021-08-21 75 0 0 阅读全文

Fabric.Js实现Diy明信片功能

本文实例为大家分享了fabricjs实现diy明信片功能的具体代码,供大家参考,具体内容如下要求需要添加,拷贝,删除,双指放大缩小。提示:以下是本篇文章正文内容,下面案例可供参考一、fabric.js是一个很好用的canvas操作插件示例:pandas是基于NumPy的一种工具,该工具是为了解决数据...

2021-03-18 98 0 0 阅读全文

Canvas操作插件Fabric.Js使用方法详解

fabric.js是一个很好用的canvas操作插件,下面整理了一些平时项目中用到的知识点://1:获得画布上的所有对象:varitems=canvas.getObjects();//2:设置画布上的某个对象为活动对象。canvas.setActiveObject(items[i]);//3:获得画...

2021-03-18 100 0 0 阅读全文

Angular使用TweenMax动画库的问题和解决方法

最近闲来无事,捣鼓捣鼓CSS发现了一个比较好动画库,就是TweenMax用起来略微有点麻烦,但是效果确实可以。首先在angular中使用TweenMax就得先通过npm安装1.npminstall--save-devgsap2.npminstall--save-dev@types/gsap然后再引入...

2021-03-18 152 0 0 阅读全文

CSS Hack用法案例详解

之前一直很狭隘的对CSShack持有偏见,觉得写得规范的代码不应该使用这些“邪门歪道”,可最近产品发布一个小问题却让我头疼了很久,最后查了一下资料,竟然使用CSShack轻松解决了,不得不服啊,对付神奇的IE就得使用这些利器。什么是CSShack由于不同的浏览器,甚至同一浏览器的不同版本对CSS的解...

2021-08-20 72 0 0 阅读全文

HTML Form表单提交方法案例详解

form表单提交方式总结一下:一、利用submit按钮实现提交,当点击submit按钮时,触发onclick事件,由JavaScript里函数判断输入内容是否为空,如果为空,返回false,不提交,如果不为空,提交到由action指定的地址。functioncheck(form){if(form.u...

2021-08-20 76 0 0 阅读全文

H5唤醒APP实现方法及注意点总结

作为前端开发人员经常会有这样的需求,如果某个用户安装了自己的APP就打开APP首页或则指定页面,如果没有安装APP就跳转到相应下载页面。这样的一个需求也是拉新和裂变必不可少的环节,所以是需要我们去解决的。今天来看看到底如何实现呢?跳转APP方式目前实现该功能的有两种比较好的方式:URLScheme、...

2021-06-21 89 0 0 阅读全文

HTML5 中的5大存储方式总结

总体情况h5之前,存储主要是用cookies。cookies缺点有在请求头上带着数据,大小是4k之内。主Domain污染。主要应用:购物车、客户登录对于IE浏览器有UserData,大小是64k,只有IE浏览器支持。目标解决4k的大小问题解决请求头常带存储信息的问题解决关系型存储的问题跨浏览器1.本...

2021-07-07 154 0 0 阅读全文

CSS Linear-Gradient属性案例详解

linear-gradient是css3的一个属性,功能强大,但是因为使用的灵活性,让没接触过的人感觉不好下手,下面来一起学习一下:一、介绍MDN介绍文档linear-gradient是一种实现线性渐变的属性,顾名思义,它的特点的是控制渐变,特点是线性的进行控制。属性介绍:linear-gradie...

2021-08-19 79 0 0 阅读全文

25行代码解决小程序的拖拽排序

//初始点击stratBtn(e){letindex=http.dataIndex(e)[0];//获取当前点击的列表letbusArr=this.data.busArr;//获取列表中的所有数组letpageY=Number(e.touches[0].pageY);//初始点击的Y点坐标letbu...

2021-06-15 79 0 0 阅读全文

Scroll-View的横向滚动

本来以为实现一个横向滚动的view很简单,但是实际上还是有个小坑的。因为scroll-view本身的display:flex不生效。scroll-view的内层view元素需要:display:inline-blockscroll-view的外层元素需要:white-space:nowrap使得内部...

2021-06-15 82 0 0 阅读全文

关于多行文本超出显示省略号所遇到的问题

今天我遇到的一个算是简单又不简单的问题,为什么说简单呢?是因为实现思路很简单,实现方法不管是自己写也好,还是网上搜也好都能搜出好几种方法。那不简单的地方呢,就是明明我已经按照网上说的代码来写了,可是实现不了我想要的效果,甚至这样的效果我以前做的项目中已经实现了,同样的代码搬到这里就不管用了。让人很是...

2021-06-15 77 0 0 阅读全文

微信小程序开发之麦克风动画 帧动画 放大 淡出

想做个录音机,第一步就卡在麦克风动画这里了.先上gif.再吐槽.①上面gif中声波的动画是个半成品.没有循环播放.在微信小程序的开发文档上找了很久,也没找到循环模式的参数设置.用setInterval()并不执行动画.我在微信小程序文档动画最下面找到这么一行字.这个锅是不是可以甩出去了?ps:如果有...

2021-06-15 106 0 0 阅读全文

通过CSS实现逼真水滴动效

哈喽哈喽!CSS真的好好玩啊,哈哈,反正我是爱了,空闲写着玩。画画不好的我乐了,下面就是一个用CSS3动画完成的模仿水珠的动效,其中主要就是会使用CSS设置阴影效果以及@keyframes关键帧和一些选择器的技术,快来学习吧!!!?实现效果:就很nice你也通过一下网址进行访问水滴点击进入灵感:看到...

2021-08-18 72 0 0 阅读全文

CSS将Div内容垂直居中案例总结

一、行高(line-height)法如果要垂直居中的只有一行或几个文字,那它的制作最为简单,只要让文字的行高和容器的高度相同即可,比如:p{height:这段代码可以达到让文字在段落中垂直居中的效果。二、内边距(padding)法另一种方法和行高法很相似,它同样适合一行或几行文字垂直居中,原理就是利...

2021-08-18 109 0 0 阅读全文

Sass常用备忘案例详解

一、变量所有变量以$开头$font_size:12px;.container{font-size:$font_size;}如果变量嵌套在字符串中,需要写在#{}中$side:left;.rounded{border-#{$side}:1pxsolid#000;} 二、嵌套层级嵌套.container...

2021-09-18 46 0 0 阅读全文

微信小程序 获取用户信息并保存登录状态

、微信小程序的运行环境不是在浏览器下运行的。所以不能以cookie来维护登录态。下面我就来说说我根据官方给出的方法来写出的维护登录态的方法吧。一、登录态维护官方的文档地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-login.html#wxl...

2021-06-19 74 0 0 阅读全文