前端开发
文章平均质量分 78
磨叽的鱼
这个作者很懒,什么都没留下…
展开
-
Vue 导航条+滑块效果
总结一个最近开发的需求。设计一个置顶的导航条,要求在激活的项目下面添加一个下划线,并随着激活项的变化,一起变化。原创 2024-08-21 13:47:25 · 891 阅读 · 0 评论 -
Vue 满屏纵向轮播图
纵向满屏轮播图的代码实现,附带详细的代码讲解和最终效果演示原创 2024-08-20 17:33:17 · 745 阅读 · 0 评论 -
Vue 旋转动画效果
这里记录一个旋转动画,在鼠标经过的时候停止,鼠标离开继续旋转。实现思路: 利用@keyframes关键字定义一个旋转动画。原创 2024-08-20 15:56:46 · 368 阅读 · 0 评论 -
Vue自定义横向轮播图
实现了一个自定义横向轮播图,并提供了效果演示原创 2024-08-19 14:54:14 · 1060 阅读 · 0 评论 -
Vue 自定义文字提示框
本文主要展示一个自定义文字提示框的具体代码,以及对应效果展示原创 2024-08-19 11:06:31 · 642 阅读 · 0 评论 -
Css布局 Grid布局
grid-template-areas 的属性值是一个或多个由空格分隔的字符串,每个字符串代表网格布局中的一行。函数 :minmax(最小值,最大值) 函数允许你同时设置列(或行)的最小值和最大值。会创建两列,第一列长度为1fr,第二列的宽度至少为 100px,且不超过1fr。Grid布局,即网格布局,通过将容器划分为"行"和"列"来创建网格,然后将内容放置在网格的单元格中,咱们可以简单理解为二维布局。定义了网格线与网格项之间的间隙(grid-row-gap 和 grid-column-gap 的简写)。原创 2024-08-01 16:10:45 · 1059 阅读 · 0 评论 -
Css flex 布局
css的flex布局原创 2024-08-01 11:42:02 · 1127 阅读 · 0 评论 -
mouseenter、mouseleave 和 mouseover事件关系和使用
鼠标经过动画是前端项目一个非常常见且重要的需求。我们常用的实现方法有两种,第一是使用css中的hover属性,第二则是利用JavaScript 提供的处理事件的函数。本文主要展开解释的是 mouseenter、mouseleave 和 mouseover 这三个JavaScript 中用于处理鼠标事件的函数,它们之间有着明显的区别和特定的使用场景。这些事件通常与 DOM 元素相关联,用于在用户的鼠标指针与元素交互时触发特定的行为。原创 2024-07-26 10:19:04 · 497 阅读 · 0 评论 -
鼠标滚动动画
本文主要汇总了两个鼠标滚动动画,第一个可以应用于导航栏,第二个是回到顶端的按钮原创 2024-07-26 09:40:59 · 437 阅读 · 0 评论 -
Css实现div宽度自适应
今天开发过程中遇上一个需求,要求一个父元素包含三个div,div并排分布,大小相等,在父元素中居中,每个div最大宽度为480px,要求能随着屏幕尺寸变化等比例变化。解决措施的话,就是利用css中的flex布局解决。/*最大宽度,因为是三个,3*480*//* 在Flex容器中允许盒子缩小 *//* 使盒子等比例填充空间 *//* 盒子之间的间隔 *//* 设置最大宽度 *//*溢出添加导航条*//*设置距顶高度*//*div的高度*/原创 2024-07-03 09:36:39 · 720 阅读 · 0 评论 -
div变形和文字居中
通过div画矩形边框和圆边框原创 2024-06-25 14:18:54 · 215 阅读 · 1 评论 -
Css实现图片满屏
在前端开发过程中,我们经常遇见需要对图片进行处理,其中图片满屏的需求非常常见,现下我就做一个记录。原创 2024-07-02 11:00:10 · 438 阅读 · 0 评论 -
Vue 配置路由
Vue配置路由原创 2024-06-24 11:48:41 · 140 阅读 · 0 评论 -
Vue登录界面设计开发
市面上大多的软件,在登录的时候给用户提供了超过一种的登录方式,常见的有手机短信登录、账号密码登录、app扫码登录,要想将这些功能组合在一起,就需要实现表单的切换功能,下面我将为你展示功能具体实现过程。原创 2024-06-24 09:48:50 · 562 阅读 · 0 评论 -
前端开发遇上的报错——那些我们走过的坑
使用vue开发过程中遇上的各种奇葩报错,这里汇总了一些,希望能给您带来帮助原创 2024-06-21 09:41:22 · 227 阅读 · 0 评论 -
【Vue2 配置 element-UI组件库】
忽略SSL验证会跳过SSL验证,存在安全风险,仅建议在测试或无法立即解决证书问题时临时使用。在App.vue运用element-ui组件。在当前项目代码的终端使用 npm命令 下载。解决措施:更新 core-js的版本即可。解决措施:更换镜像源;这里提示 core-js的版本低了。在 main.js 里面配置。下载 element-ui。这种报错是指证书已经过期。淘宝镜像源过期解决方式。原创 2024-06-20 11:26:49 · 513 阅读 · 0 评论