随笔分类 - 前端总结
学习前端过程的一些总结
摘要:之前因为有使用resize()事件,而jQuery自带的resize()只能绑定到window对象上,所以搜索到了一份别人写好的自定义resize事件,然而这份代码其实很多地方都有,找不出来源头,发现代码后面有不少知识点,所以便做了一些解析,好好了解一下相关的知识点,不过有时候学的多点,才知道自己的
阅读全文
摘要:好吧,这里直接编辑源码并不允许设置css和js……毕竟会有危险……那直接放代码吧 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initia
阅读全文
摘要:包括: 1、Missing space before function parentheses 2、如何给.vue文件的页面添加css 3、如何给.vue文件页面里的元素添加监听器 4、如何为每一个页面引入css文件 5、如何去掉127.0.0.1:8080/#/中的‘#’ 6、如何与后台进行数据交
阅读全文
摘要:其实平时很少用到transform属性,一些放大缩小用width、height可以改变,一些位置变换,更是有margin,而一些旋转、2D、3D变换也不怎么能用得到。不过最近接触了一些图片的缩放,觉得不错,我就进行了一下学习。transform的元素会根据方法进行位置大小等的变换,但是还占据着原本在
阅读全文
摘要:图片布局在前端很多时候的时候因为图片本身大小长宽比例不同,想要布局得好看,需要注意几点问题,下面写一写怎么布局,主要讲的是<img>元素,需要自己定制形状的可以考虑canvas,前面有讲。 先看看<img>默认布局的特点,<img>是行内元素,不设置大小的时候按图片原本大小显示,每个<img>之间有
阅读全文
摘要:主要自己总是不记得 结构如下,涉及jq中获取当前元素是父元素的的第几个元素,jq中获取某类在同类元素中占第几,each方法 1、jq中获取当前元素是父元素的的第几个元素 如上面的dom结构,我们知道,所有类c的元素都是类parent的子元素,所以我们可以直接使用index来获取类myc在父元素中的顺
阅读全文
摘要:PDF.Js的使用—javascript中前端显示pdf文件 写于2018/12/6 起因是一个图片展示页面需要展示pdf格式的文件,所以查了半天决定使用pdf.js,我也不求有多了解它,能实现我想要的效果就行,但至少到了最后我让它的demo跑了起来。 网上很多教程要么不全,要么就是很杂很深又不靠谱
阅读全文
摘要:因为canvas总结到后面又想到了jszip的一些事情,那就索性也回去看看吧。试过,至少谷歌和火狐都是支持jszip的。 1、 jszip的使用 官方文档说的很清楚了,而且也有读取zip文件、生成zip文件下载的js代码示例,下面就简单说说吧。 <1>读取zip文件,一般用于上传zip文件后读取内容
阅读全文
摘要:之前就说了canvas设置大小的时候用的就是设置实打实的像素值,像图像一样设置百分比然后根据浏览器大小自己适应大小是不可能的——当然一般也不会想要cavans改变大小。不过项目之前有用到过,既然去了解了,就记下来防止忘记。 不能自己适应,就只能每次外部容器发生改变的时候给它重新设置大小了。 1、 $
阅读全文
摘要:1、 canvas生成base64数据 canvas.toDataURL()生成的数据可以直接给image对象使用作为<img>显示在前端,也可以传给后台生成图片保存。前端生成保存图片的好像也有,但是比较麻烦,而且不兼容。我记得zip.js就可以在前端打包图片生成压缩包,不过我现在用不到,哪天想到了
阅读全文
摘要:1、 使用canvas绘制图像 什么是图像?在js中它就是一个<img src=””>,<img>有两种接收图像信息的方法,一个是直接链接到图像地址,一个使用base64数据,不过这里讨论的是canvas要使用的Image对象。我们有两个方式定义: <1>在html中定义好,然后根据id获取 <2>
阅读全文
摘要:1、 如何根据鼠标位置获取canvas上对应位置的x,y。 2、 canvas的图糊了,设置宽和高的方式不对。 3、鼠标绘图代码 之前听说过canvas这个元素,但是实际上并没有深入了解过。不过日前有个项目一是使用canvas显示dicom格式的医疗影像,一是利用canvas元素生成图像压缩包,将之
阅读全文
摘要:Js和jq事件—键盘事件KeyboardEvent 键盘事件keydown,keypress和keyup,还需要涉及到一个文本事件textInput。 keydown,keypress和keyup事件在js和jq中都支持。但是你想要触发这三个事件,必须有文本输入操作(该元素是,或者包含的子元素是文本
阅读全文
摘要:转 DOM0,DOM2,DOM3事件处理方式区别 2016年07月13日 15:00:29 judyge 阅读数:1457更多 个人分类: js与前端 转 DOM0,DOM2,DOM3事件处理方式区别 2016年07月13日 15:00:29 judyge 阅读数:1457更多 个人分类: js与前
阅读全文
摘要:1、鼠标事件的主要事件应该是mouseup, mousedown, mousewheel, mousemove, mouseover, moveout。 <1>其中mouseup和mousedown组成了单击(click),双击(dblclick)事件,或许还有拖拽事件,不过我还没有涉及到。表单事件
阅读全文
摘要:mousemove,一个监听元素上鼠标移动的事件,如果鼠标在元素上移动,大概每16毫秒触发一次。我觉得挺有趣的一个元素,不过有替代还是不太推荐,从这个事件的触发频率就可以看出它会拖慢响应速度,消耗资源。 在js中可以使用onmousemove和addEventListener(‘mousemove’
阅读全文
摘要:javascript使用mouseover和mouseout,只在css中支持hover jquery支持mouseover和mouseout,封装了mouseenter、mouseleave事件函数和hover函数 1、有关js中的mouseover和mouseout 原生js的事件类型是mous
阅读全文
摘要:很想把滚动条事件跟鼠标滚轮事件放在一起,那就直接写在这一篇了。除了事件以外,对滚动条样式的调整也记在这里吧。 滚动条是浏览器的默认事件,使用overflow:auto/scroll都有可能出现,它的默认事件在各个浏览器大多一样,它的样式在各浏览器都有不同的表现。但是通过js我们可以阻止它的默认事件,
阅读全文
摘要:<1>js事件 滚轮事件在js中,不同浏览器还是有不同的,介于我只测试谷歌和火狐浏览器的情况,其他浏览器有待自行探索。有三种写法: 在以上三种方法中,target.addEventListener(‘wheel’,function(){});是最通用的,3大概不怎么用了,如果需要兼容低版本的火狐浏览
阅读全文
摘要:右键点击触发是浏览器的默认菜单事件contextmenu,你可以选择阻止它,使用event.preventDefault();或者return false;。 想要定义右键点击事件,关注的是mouseup或者mousedown事件,使用event获取点击的键: Js中使用event. button
阅读全文