前端实现图片旋转功能

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

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

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

基于 Flex 实现两端对齐垂直布局

2020-10-15
阅读 3 分钟
8k
正好前段时间用 weex 做了一个页面,weex 天生基于 flex 。且 weex 中 flex-direction 默认值为 column,flex-direction 定义了 flex 容器中 flex 成员项的排列方向。

JS效果之《获取鼠标所在区域的容器,区域外都遮罩半透明》

2020-10-09
阅读 4 分钟
4.9k
获取鼠标位置,鼠标属于的容器。mouseover,mouseout,mousedown,mouseup,mouseenter,mouseleave,mousemove 这么多事件太容易了。但是因为 DOM 结构太多了,其实要的元素有可能是父级、祖先级,这里需要实现一个类似于 jquery 的 parants。

横竖屏检测 orientation resize matchMedia

2020-03-14
阅读 2 分钟
3.5k
这在家办公也不让闲着点。虽然说需求提出来了,但是我们身为一个前端er,还是要有自己的想法呀,我们要统计一波数据看看到底有多少人在横屏使用我们的产品。

前端培训-初级阶段-场景实战(2019-05-16)-聊天头像-微信头像-群组头像

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

前端培训-初级阶段-场景实战(2019-05-09)-聊天框-发送框

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

前端培训-初级阶段(5 - 8)

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