前端实现图片旋转功能

2023-09-13
阅读 6 分钟
1.6k
前两天遇到一个小需求,需要将横屏图片转为竖屏展示。整理一下相关内容。通过 csstransform rotate 来控制展示时显示效果一般是在图片审核等场景,实现一个类似的功能。方便审核人员查看图片测试传送门:[链接]transform scale 来控制展示时显示效果测试传送门:[链接]「蹭热点,请给我一面国旗@微信官方」 这是之前仿头...

「前端 BUG 录」记一次线上 Bug 排查过程:思否文章目录

2023-07-26
阅读 2 分钟
580
昨天晚上为了参加「探索编码世界之旅 - 记我的第一份编程工作」,撸了一篇文章结果发现目录结构没有层级起初怀疑是我标题级别设置异常,通过反复查看 markdown 原文,并无异常然后又对个人的历史文章,及月榜文章进行查看,层级全部丢失通过上面的操作,我们已经可以确定只有两个可能:「官方故意拍平层级」或者「层级计...

自信自律永不放弃「探索编码世界之旅 - 记我的第一份编程工作」

2023-07-25
阅读 2 分钟
619
Hello,小伙伴们 ~ SegmentFault 思否 7 月写作挑战赛来咯我先把前面 11 个人的文章都看了,然后开始写我的回忆录。不知道你还记得第一次接触编程时的心情吗?不知道你是否还记得,但是我一直记得,并且会一直记得。我也有边城大佬的困惑「到底哪一份才算是第一份呢?」第一次看到 Code我最早见到的 Code 是在杂志《黑...
封面图

「前端 BUG 录」遇到BUG应该如何排查

2023-03-24
阅读 2 分钟
1.1k
我们日常工作中虽然会遇到很多 BUG,我们也熟练掌握使用搜索引擎解决开发中的问题。但是当遇到线上 BUG 应该如何排查呢?我将我过往遇到的一些异常整理了出来,并将我遇到的干扰项以及问题点都做了详细记录。希望对你有所帮助排查路径确定是否变更导致?如果是变更导致需要及时回滚止损。非变更导致可以排查一下异常版本...

疫情已过,2023 我的前端面试记录

2023-03-23
阅读 2 分钟
1.9k
顺利入职。把我最近找工作的心得记录下来。工作交接确定 lastday整理手头工作,相关对接人、交接人放文档中工作交接过渡阶段。做好被咨询者,该拉人拉人,该拉群拉群平时沟通顺畅的同事如果没有 WX 可以加一个属于自己的资料整理备份(公司的就别动了,法务警告⚠️)仓库权限、系统权限、手续等等,该交接就可以交接了门...

2022 年终总结 | 我离职了

2023-01-11
阅读 2 分钟
1.4k
往年的我早早就参与了活动,今年不知道为什么,直到 2023.01.09 原来这就是答案。虽然果只有一个,但是因会有很多可能,不管怎么说反正是润

如何获取在思否「问答」打卡中的完成次数?

2022-06-12
阅读 4 分钟
2.6k
最近 「SegmentFault 思否社区 10 周年「问答」打卡」 十分火热,但是有一个小问题,经常不知道是否完成今天的 KPI,以及小尾巴是否正常添加,那我们今天来做个小工具。

css 如何把元素固定在容器底部?(四种方式)

2022-06-07
阅读 2 分钟
9.8k
前几天被人问,「如何把元素固定在容器底部」。(本来想直接把 demo 地址给他,结果没找到,那么今天我们来补一下)Demo 地址想法&思路如果是页面底部,我们可以直接 position: fixed;bottom: 0; 基于浏览器定位直接实现。但是他要的效果是基于父级容器,那么我们必须要使用其他手段来定位了relative 来限制 absolute,...

「前端 BUG 录」变更 UI 库主题引发的问题

2022-05-23
阅读 2 分钟
2.1k
最近有个项目(就叫他 P 项目)做了一次 UI 视觉统一。之前是个小项目用的是默认主题 theme-d ,这次需求还针对性的发布了一套 theme-p 主题。然后出事故了,更新了主题之后我们的 dialog 显示异常了。使用控制台查看样式通过查看样式我们发现都是 UI 的样式,并没有我们手动覆盖的样式。但是这里有一个异常点有四个生效...

如何做新人引导功能?

2022-05-16
阅读 3 分钟
5.8k
节前碰到一个需求:「新人引导效果」针对第一次使用平台的用户进行主要功能引导。具体引导路径为:点击“新增按钮”,对弹出的内容进行解释,并引导用户填充表单,最后提交表单。

实现聚焦效果

2022-05-11
阅读 6 分钟
2.3k
这是之前朋友问我的一个功能:他觉得看网页有时候注意力会被转移,希望可以有个蒙层帮助他集中注意力反手我就用 box-shadow 把功能写了出来。 {代码...} 因为 z-index 无法超过非 static 层级导致的 bug在我测试中发现了一些比较阴间的效果所以我们要小改动一下。直接给父级 ZIndex 全部提升。 {代码...} 因为 overflow ...

node 异常数据响应排查(pm2 Cluster Mode、异步)

2022-05-09
阅读 4 分钟
2.2k
node 里面写的一个 js 文件里面的方法,这个 js 文件里面有声明一个 var 全局变量(global),然后上面说到的方法就是先判断全局变量是否有值,要是就值就直接返回,要是没有值就通过接口去获取值; 然后在页面上特定的一个操作之后,会把这个全局变量的值清空为null,然后就走上面的获取接口的值本地正常,服务器上错误

2022招聘季 | 怎么准备面试?面试官一般会问些什么问题? | web 前端

2022-03-20
阅读 7 分钟
7.3k
前两天北京下雪了,很冷。2022 招聘季,好像也比往年冷一些。2021 年 K12 的大量裁员,腾讯、快手、字节、滴滴、蘑菇街也在裁员。想要换工作的同学应该准备些什么呢?面试流程是什么样子的?如何应对面试呢?怎么样可以提高成功率?如果你关心上面的问题,并且你的目标位置不超出我的能力范围(高级工程师、阿里P6、字节...
封面图

Web 页面优化专项 > Lighthouse > 性能分数优化

2022-03-10
阅读 6 分钟
7.6k
Lighthouse 目前已经集成在新版本 Chrome DevTools 中,也可以将其作为一个 Chrome 扩展程序运行,或从命令行运行。
封面图

Web 页面优化专项 > 加载速度优化专项 > 体积优化

2022-02-08
阅读 4 分钟
2.8k
为什么我说 CDN 可以提速不全对?脱离剂量谈毒性,都是耍流氓(这里指脱离环境一把梭哈不现实) CDN 是指是什么?CDN 的全称是 Content Delivery Network,即内容分发网络。CDN 是构建在现有网络基础之上的智能虚拟网络,依靠部署在各地的边缘服务器,通过中心平台的负载均衡、内容分发、调度等功能模块,使用户就近获取...
封面图

我想用 JS 实现 0.1 + 0.2 输出 0.3

2021-12-24
阅读 4 分钟
6.2k
因为 JS 精度问题 0.1 + 0.2 == 0.30000000000000004 ,可以不可以得出一个正确的值。0.1 + 0.2 == 0.3

2021年度总结:变换

2021-12-21
阅读 4 分钟
2.9k
回忆今年感觉过的更快了,又到了年度写总结的时候。先来快速过一下回忆一下今年离开了工作五年的公司。入职了一个大一点的公司租的房子也换了,租金暴涨输出内容文章产出惨不忍睹,只有个位数。问答也不如去年,只有 500+,不过也算一日一题吧。分享、调研等对内输出前半年还在做,后半年换工作了频率减下来。出游的话,...
封面图

基于 elementUI table 组件实现自定义列、宽度、排序并联动同步

2021-07-30
阅读 4 分钟
8.9k
哈喽,大家好又是我。昨天有个人在群里问:“基于 elementUI 如何实现拖动修改列宽度,并同步在多个表格中”。这个功能其实听常见的,在不同的使用者眼中关注点就应该是不一样的。比如:项目的主管,更关心进度前端开发,关心设计稿、接口什么时候提供后端开发,关心前端什么时候写完,什么时候联调测试人员,关心什么时候...
封面图

2021 年了,你还不会瀑布流布局?(三种靠谱JS方案 + N种不靠谱CSS方案)

2021-07-16
阅读 6 分钟
13.4k
我们也想做一个展示我们设计稿(定宽,不定高)的页面,瀑布流是很棒的一种方案。瀑布流布局其核心是基于一个网格的布局,而且每行包含的项目列表高度是随机的(随着自己内容动态变化高度),同时每个项目列表呈堆栈形式排列,最为关键的是,堆栈之间彼此之间没有多余的间距差存大。还是上图来看看我们说的瀑布流布局是...
封面图

前端预览 PDF 文件(使用PDFJS)

2021-07-13
阅读 7 分钟
30.8k
哈喽大家好啊。前半年还挺忙的,一直也没有发文章,有老哥想我了嘛。这两天发现老有人私信问我 PDF 相关的内容。那么好,为了我能安心摸鱼,我准备出一篇文章来介绍一下如何使用 PDFJS 。PDF.js 是什么?PDF.js 由 Mozilla 提供支持。目标是创建一个通用的、基于 Web 标准的平台,用于解析和呈现 PDF。预览 PDF使用 ifra...
封面图

SegmentFault 思否 9 周年丨生日快乐

2021-06-17
阅读 1 分钟
1.7k
祝思否生日快乐,越办越好,越做越大哈哈。2016-07-12 加入思否社区,在思否社区快五年了,也算是见证了思否社区的成长,功能也越来越多的,有点评、课堂、视频、直播等等。当然我还是一直是问答区的忠实用户(还是那个不变的少年啊)。也见证了凉了的产品「付费问答」(因为凉了所以没有链接了),格子广告好像也没了。五...

2020总结😊我想混个奖品

2021-01-01
阅读 1 分钟
1.9k
又到了一年一度写总结的时候,趁着热度我也来混一波阳光普照。今年总结起来其实蛮简单的居家隔离、远程办公、疯狂加班。对,今年的一年就是这么平淡无奇。比如现在的我就是在切完元旦活动,但是又不能睡觉的时候,来写年度总结。思否去年是问答区的「Top Writer」,今年不知道还能混上不。刚才看了一下今年回答了 38*20=...

面试题:使用 css 隐藏页面元素

2020-12-03
阅读 2 分钟
2.4k
我们先来说一下限制条件可以使用 css、html、js元素为一个 100*100 的红色矩形,里面包含一个 50*50 黑色矩形只要在页面上看不到就算隐藏测试地址:[链接]实现隐藏页面元素移动到屏幕外面,眼不见心不烦marginleft + positiontransform:translate使用特性displayvisibilityopacityoverflow:hidden + 0宽高transform:scal...

面试题:JS 获取图片宽高

2020-12-02
阅读 4 分钟
7.3k
一般用于审核后台,比如说要求图片在一定区间内才能加精。也用于在 canvas 中裁图时计算缩放比例。JS 获取图片宽高获取 naturalWidth(callback 版本)方案为获取 naturalWidth。那么 naturalWidth 和 width 有什么不同?naturalWidth 标识图片的原始宽高。width 因为历史问题,标识的其实是 DOM 元素宽高。因为 img 标...

面试题:JS 获取某月的天数

2020-12-01
阅读 2 分钟
3.8k
我们一直解题的方案是根据一个顺口溜:一三五七八十腊,31天永不差,四六九十一,每月30天,惟有二月二十八,闰年要把日加一。(我搜的,具体怎么背我忘了)

前端培训-中级阶段(52)- Express 的安装、使用 Express 完成 RESTful 操作 MongoDB

2020-10-31
阅读 8 分钟
2.1k
前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门,但也仅仅是入门,现在前端开发的定义已经远远不止这些。前端小课堂(HTML/CSS/JS),本着提升技术水平,打牢基础知识的中心思想,我们开课啦(每周四)。

面试题 - 将伪数组转换为数组的 N 种方案

2020-10-30
阅读 2 分钟
2.6k
今天面试了一个人,居然不知道如何将伪数组转换为数组?什么是伪数组?有 length 属性,而且也是数值下标的对象。不具备 Array.prototype 上的方法常见伪数组argumentsdocument.getElementsByClassName$('div')伪数组转换为数组输出伪数组 {代码...} 使用 Array.from (ES6+)(babel-polyfill) {代码...} 使用 ... 展...

前端 BUG 录 - input 数字校验异常问题

2020-10-29
阅读 2 分钟
2.4k
小伙伴做的是实名认证(移动端)相关的功能,然后有个位置校验了只能输入数字。小伙伴发出了灵魂质疑:为什么 1. 没事 1.. 就被清空了? 这个问题告诉我们喝一点没事,“一點點”不行。

前端 BUG 录 - 科学计数法是什么?

2020-10-28
阅读 3 分钟
7.1k
把一个数表示成a与10的n次幂相乘的形式(1≤|a|<10,a不为分数形式,n为整数)。19971400000000 == 1.99714×10^13 == 1.99714e13

如何通过 response 的头信息获取文件类型?

2020-10-27
阅读 5 分钟
5.3k
今天在前端工匠的群里,看到了一个问题(下载文件,但是请求头中需要传递 token,如何下载文件?怎么设置文件类型?),我们来解决一下这个问题。