自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(38)
  • 收藏
  • 关注

原创 canvas画笑脸

【代码】canvas画笑脸。

2024-09-18 14:56:54 537

原创 滚动条样式(显示/隐藏)

【代码】滚动条样式(显示/隐藏)

2024-09-03 09:59:23 98

原创 文字滚动在ios设备不生效

设置顶部区域滚动时,安卓和pc上都可以正常滚动显示,ios上效果失效。引入的图片是静态区域的图片,所以要用require引入图片路径。以下代码主要是实现区域的布局,文字滚动用到的是。滚动区域是图片加文字的组合,用数组循环出来的。

2024-09-03 08:51:36 501

原创 根据图片的宽高比例来控制图片的显示效果

遇到问题:后台获取的图片宽高不定,有可能宽大于高,也有可以高大于宽,这时候设置objec-fit时就会不稳定,控制一方显示了,另一方的图片就可能显示的效果不是我们想要的,特别是人物的时候,比如我有一个宽大于高的div盒子,需要在盒子内显示后台传入的人物图片(图片是后台获取的),当后台传入和我一样宽大于高的盒子时,我设置objec-fit:cover;:保持宽高比例不失调的情况下可以把人物脑袋显示出来,会比上面效果好一些,但仍不是最优方案,主体有点太靠顶显示,根据宽高对比添加naturalWidth类样式。

2024-08-30 16:14:37 169

原创 构建渐变样式:同色系变浅(十六进制颜色转为RGB)

dynamicColor为十六进制颜色,#cccccc。

2024-08-26 14:02:54 82

原创 颜色不改变透明度,往白色系变亮

hex要传入的颜色,percent:0-100,百分比数值,变亮。

2024-08-23 10:26:10 185

原创 移动端屏幕拖动按钮

用在移动端触摸屏幕上的盒子滑动,这里用在返回按钮。

2024-08-05 09:52:04 141

原创 动态设置van-tabs-active背景颜色

当项目中颜色需要动态设置时(颜色从后端获取),使用的时vant-tabs组件。

2024-07-22 15:28:52 430

原创 盒子颜色由深变浅

js部分主要设置opacities透明度来实现盒子由深变浅,array为循环的数组。再设置行内样式:让盒子颜色由深到浅,主要通过设置透明度实现,数组中的五个值来循环为它们设置不透明度。数组有无限多的元素,你也总是能够使用。设置盒子正常大小及其他样式,的使用是为了确保索引值。这样,你就可以确保即使。

2024-06-28 10:41:58 222

原创 类似qq空间图片布局:一个图片撑满整行;两个图片,两个并排方形显示;三个及以上,一行方形显示三个,九个以上,最后一张图片上方显示剩余图片数量

imgIndex === displayImages(item.handbookImages).length - 1,它是用来判断只在最后一个图片上方显示剩余图片数量样式,不加的话,所有图片上方都会显示剩余图片数量。displayImages(item.handbookImages)是方法,传入数据,会在js部分有处理。做动态样式,用于判断当前数组中的图片是几张,下面是css代码。以上仅部分代码,逻辑是通的,data数据和获取接口数据省略。

2024-06-12 15:50:16 294 1

原创 日期选择器el-date-picker选择周、月、年

【代码】日期选择器el-date-picker选择周、月、年。

2024-05-17 08:48:28 426

原创 创建vue3项目

2、npm init vue@latest (仅创建项目,测试)1、node v16版本以上。

2024-05-15 09:37:42 320

原创 uniapp登录getPhoneNumber

getPhoneNumbe方法r必须在按钮上使用。

2024-05-13 09:08:19 887

原创 用js在给定的多个盒子中,动态的显示多个星星

document.addEventListener('DOMContentLoaded', function () {} 是为了监听DOMContentLoaded事件,当html文档解析完成会触发DOMContentLoaded,可去掉,也可换其它。

2024-04-30 11:32:16 155

原创 css预处理器

css预处理器定义了一种新的语言,主要是通过用一种专门的编程语言,为css添加一些编程特性,再编译生成css文件。可以帮助我们编写可维护的、与时俱进的代码,减少需要编写的CSS数量,对于那些需要大量和样式规则的大型用户界面是非常有帮助的。

2024-03-24 17:08:18 423

原创 vue-router

声明式导航&编程式导航、路由守卫、route和router的区别

2024-03-24 14:30:22 832

原创 响应式布局(flex布局,rem布局,流式布局,vw / vh)

弹性盒子是CSS3的一种新布局模式,当页面需要适用不同的屏幕大小或者设备类型时确保元素拥有恰当的行为的布局方式。对一个容器中的子元素进行排列、对齐和分配空白空间。父容器属性定义为display:flex,表示该元素内部时弹性盒子布局flex-direction 属性决定主轴的方向(即子元素的排列方向)flex-wrap 设置弹性盒子的子元素超出父容器时是否换行align-items 设置弹性盒子元素在侧轴(纵轴)方向上的对齐方式。

2024-03-21 16:51:25 1046

原创 es6新特性

es6新特性

2023-04-11 21:52:04 94

原创 js中bind、call、apply的区别

js中bind、call、apply的区别

2023-04-04 16:44:29 105

原创 vue组件通信

父向子通过props子向父 $emit触发自定义事件ref 通信兄弟组件通信 EventBus$parent或$childrenvuex。

2023-03-23 11:11:08 71

原创 uniapp微信支付

uniapp微信支付

2022-12-07 09:53:28 497 1

原创 前端权限控制

前端权限控制

2022-08-02 10:26:42 1443

原创 浏览器的渲染机制以及性能优化

浏览器的渲染机制以及性能优化

2022-07-31 19:56:28 176

原创 虚拟Dom、diff算法、nextTick

虚拟Dom、diff算法、nextTick

2022-07-29 20:08:20 271

原创 vuex、浏览器缓存机制、数据响应式的原理

vuex、浏览器缓存机制、数据响应式的原理

2022-07-27 16:31:40 600

原创 重绘与回流、let const var区别

重绘与回流、let const var区别

2022-07-27 09:46:42 59

原创 原型链、new的过程、防抖和节流

原型链、new的过程、防抖和节流

2022-07-26 20:51:38 533

原创 computed和watch、闭包

computed和watch、闭包

2022-07-26 20:03:43 265

转载 宏任务微任务

宏任务 微任务

2022-07-26 08:24:37 121

原创 $router和$route的区别,v-if和 v-for,v-show

$router和$route的区别,v-if和 v-for为什么要避免结合使用,v-show和v-if的异同

2022-07-25 20:27:21 507

原创 slice()和splice()的区别

slice截取从索引开始到索引结束的字符,返回新数组;splice插入、删除元素,改变原数组

2022-07-25 18:24:42 87

原创 截取字符串substr和substring的区别

substr截止是取长度;substring截止是取索引,且不包含尾

2022-07-25 17:18:45 243

原创 v-model、单向数据流

v-model、单向数据流

2022-07-25 16:30:16 287

原创 数据类型和数据类型检测

typeof和instanceof

2022-07-25 16:11:22 96

原创 父子组件的生命周期执行顺序

调用先父后子,完成先子后父

2022-07-25 15:33:19 159

原创 VUE生命周期

生命周期:四个阶段,八个钩子

2022-07-25 15:11:59 161

原创 两种设计模式

观察模式和发布订阅模式

2022-07-25 14:51:15 118

原创 深拷贝和浅拷贝

如果有循环就会堆栈溢出,解决把处理好的对象先存起来,在处理新的对象的时候,先在这个存的地方找找有没有处理好,处理好就返回。1.使用JSON.parse(JSON.stringfy(obj)),但使用它是有缺点的,对象有方法的时候,方法会丢失。浅拷贝使用Object.assign({},obj)或{...obj}2.对象有方法的时候,可以使用递归。深拷贝对象有多层,比如一个对象的属性还是对象。浅拷贝如果对象只有一层,使用浅拷贝。......

2022-07-25 14:34:03 60

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除