前端经验

使用html2canvas 页面转图片

!DOCTYPE html html lang = en head meta charset = UTF-8 title 页面转图片 / title link rel = stylesheet href = https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css integrity = sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5T...

前端经验

CSS+jQuery实现点击展开折叠菜单

!DOCTYPE html html head title 折叠菜单 / title style body { background :grey; font-family :Microsoft Yahei; color :white;} .types a { text-decoration :none; color :white;} .types ul { display :none;} .files ul { display :none;} / style...

前端经验

JavaScript阻止事件冒泡与事件捕获

1、事件冒泡 在一个对象上触发某类事件,如onclick事件等,在其祖先节点上也会依次触发该事件。 body nclick = alert(body) div nclick = alert(div) a href = nclick = alert(a) 事件冒泡 / a / div / body 依次...

前端经验

Css实现图片斜切效果

css mask的原理:只会把遮罩图里透明像素所对应的原图部分进行隐藏。 渐变图作为mask,置于另 一张图片上面。 !DOCTYPE html html head meta charset = utf-8 / meta name = viewport content = width=device-wi...

前端经验

windows下搭建Vue.js开发环境教程

1、安装node.js node.js的官方地址为:https://nodejs.org/en/download/。 根据windows版本后,选择要下载的安装包,下载完毕,按照windows一般应用程序,一路next就可以安装成功,建议不要安装在系...

前端经验

HTML5离线存储的使用及原理注意事项

在用户没有与因特网连接时,可以正常访问站点或应用;在用户与因特网连接时,更新用户机器上的缓存文件。 原理: HTML5的离线存储是基于一个新建的.appcache文件的缓存机制(不是存...

前端经验

JS实现图片区域局部放大效果

模拟淘宝的商品页,鼠标放在左侧的小图上时,显示方格区域,再右侧将图片方格区域的图片部分放大显示。 // 获取左侧图片路径后赋值给右侧大图片 如果左侧有多张小图片 请将获取...