
前端
鱼与雨于语
记录
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
.attr()与.data()的区别
1.attr属性是必须写在html标签上,它属于dom属性,而data是储存于jquery对象模型上,它属于jquery对象属性,因此,它俩本质不一样; 2.attr的运行机制是:$.attr()取值和赋值都是找到html标签,直接操作该标签的属性; 3.data的运行机制是:页面第一次解析时,会将dom节点的attribute值存放到内存中, $.data()取值和赋值都是直接操作这个内存值,而不是dom元素; 综上所述: 1.避免attr和data的混合使用,以免因为数据不一样,产生bug;原创 2021-08-06 17:02:23 · 653 阅读 · 0 评论 -
swiper 使用
1、在元素display: none 时,不执行 设定参数(最低支持swiper版本 3.0.0 ) observer:true,//修改swiper自己或子元素时,自动初始化swiper observeParents:true//修改swiper的父元素时,自动初始化swiper原创 2021-05-26 16:50:51 · 533 阅读 · 0 评论 -
uniapp 小程序 绘制canvas
在使用canvas 绘制图片时,由于有时候图片会加载过慢,导致绘制空白,所以应该先把图片加载成功才进行绘制,使用 uni.getImageInfo({ Src: ‘’; success:function(res){ context.drawImage(res.path,0, 0, width, height); } }); 在有多个图片绘制时: uni.getImageInfo({ Src: ‘’; success:function(res){ context.drawI...原创 2020-07-29 13:59:51 · 1794 阅读 · 0 评论 -
移动端 字体大小设置 适配
html { font-size: 20px; font-size: 5.33334vw; } @media screen and (max-width:320px){ html { font-size: 17.06667px; } } @media screen and (min-width:750px){ html { font-size: 40px; } } body { max-width: 750px; margin: a.原创 2020-06-22 17:51:58 · 1243 阅读 · 0 评论 -
华为p30自带浏览器 样式表命名为skin.css 里面的color样式不起作用
样式表命名为skin.css 华为自带浏览器 里面的color 样式不起作用, 所以不能用skin.css原创 2020-06-22 17:06:45 · 383 阅读 · 0 评论 -
fis3前端工程构建配置 ..............正在学习记录
// 配置配置文件 //让所有的静态资源构建后到 static 目录 fis.match('*.{png,js,css}', { release: '/static/$0' }); //加 md5 fis.match('*.{png,js,css}', { useHash: true }); //压缩文件 fis.match('*.js', { // fis-optimizer-uglify-js 插件进行压缩,已内置 optimizer: fis.plugin('ug.原创 2020-06-08 15:42:12 · 318 阅读 · 0 评论 -
jquery自定义分页插件(带回调函数) 链接分享
https://www.cnblogs.com/x0216u/p/7463679.html原创 2020-06-02 17:35:29 · 202 阅读 · 0 评论 -
使用RGBA实现背景颜色半透明并兼容低版本IE浏览器
示例: background: rgba(0,0,0,.5); filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000); IE渐变滤镜: filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr= #AARRGGBB,endColorStr= #AARRGGBB,grad...原创 2020-05-30 14:56:45 · 776 阅读 · 0 评论 -
css 样式 单行、多行文本溢出 显示省略号 方法
单行省略号: overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 多行省略号: display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; 注: -webkit-line-clamp 用来限制在一个块元素显示的文本的行数。 ...原创 2020-05-30 13:51:08 · 227 阅读 · 0 评论 -
阻止点击事件冒泡
//需要排除的元素 阻止点击事件冒泡 $('.a').click(function(e){ e.stopPropagation(); }) $('body').click(function(e){ if($(e.target) !== $('.a')){ //除了元素.a 之外的空白 } })原创 2020-05-30 13:40:08 · 392 阅读 · 0 评论 -
有些浏览器底部工具栏遮挡吸底内容解决方案
苹果、UC浏览器、QQ浏览器: <!--删除苹果默认的工具栏和菜单栏--> <meta name="apple-mobile-web-app-capable" content="yes"/> <--UC强制全屏--> <meta name="fullscreen" content="yes"> <!--QQ强制全屏--> <...原创 2020-04-14 17:08:25 · 4471 阅读 · 0 评论 -
网站 灰色调
如何让实现整站变灰色调 (一般用于悼念活动) html{filter: grayscale(100%);filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);} 那么问题来了,IE 10...原创 2020-04-03 17:43:35 · 528 阅读 · 0 评论 -
倒计时 canvas 绘制
不能匀速 还不知道咋改 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...原创 2019-07-29 09:12:32 · 241 阅读 · 0 评论 -
flex 布局 详细总结(弹性布局)
Flex 是 Flexible Box 的缩写,意为"弹性布局" 任何一个容器都可以指定为 Flex 布局 块元素: display: flex; 行内元素: display: inline-flex; 如果是webkit内核浏览器,需加上-webkit- : display: -webkit-flex 兼容: Chrome 21+ 、 Opera 12.1+ 、Firefox ...原创 2019-07-29 15:18:14 · 188 阅读 · 0 评论 -
textarea根据输入内容增高
$.fn.extend({ autoHeight: function(){ return this.each(function(){ var $this = $(this); console.log($this.outerHeight()); ...原创 2018-12-17 09:43:50 · 322 阅读 · 0 评论 -
利用伪类 编写 纯css 飘带效果
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2018-11-27 14:27:31 · 1186 阅读 · 0 评论