上一页 1 ··· 19 20 21 22 23 24 25 26 27 ··· 69 下一页
2022年3月11日
DOM – MutationObserver
摘要： 介绍 它和 IntersectionObserver, ResizeObserver 差不多, 都是观察 element 变化的. 它可以观察元素的 attribute 增加, 移除, 修改, append child 等等. 建议先看前 2 篇 IntersectionObserver 和 Res 阅读全文
posted @ 2022-03-11 21:15 兴杰 阅读(214) 评论(0) 推荐(0)
DOM – ResizeObserver
摘要： 介绍 想监听一个 element 的 size changes 就可以使用 ResizeObserver 了. 在看这一篇之前, 建议先看看 DOM & BOM – IntersectionObserver, 它们的模式很像, 一起了解会比较容易. 效果 参考: MDN – ResizeObserv 阅读全文
posted @ 2022-03-11 19:38 兴杰 阅读(309) 评论(0) 推荐(0)
DOM – IntersectionObserver
摘要： 介绍 IntersectionObserver 的作用是监听某个元素是否出现在框内 (比如 viewport). 它可以实现 lazy load image, 一开始图片是没有加载的, 当图片出现在 viewport 时才去加载. 也可以用来做 tracking, 比如某个商品 (card 元素), 阅读全文
posted @ 2022-03-11 15:13 兴杰 阅读(434) 评论(0) 推荐(0)
2022年3月10日
CSS – Counters
摘要： 介绍 counter 有点像 JS 的 for loop index. 最常用到的地方就是做 ol > li. 参考: W3Schools – CSS Counters 默认 ol > li <ol> <li> Lorem ipsum dolor sit amet. Lorem ipsum dolo 阅读全文
posted @ 2022-03-10 23:21 兴杰 阅读(114) 评论(0) 推荐(0)
CSS & JS Effect – FAQ Accordion & Slide Down
摘要： 效果 参考: Youtube – Responsive FAQ accordion dropdown | HTML and CSS Tutorial 几个难点 1. 如何 align left for +- icon. 2. 如何实现点击 3. 如何实现 slide down 一步一步做 Seman 阅读全文
posted @ 2022-03-10 14:49 兴杰 阅读(133) 评论(0) 推荐(0)
2022年3月8日
CSS & JS Effect – Hamburger Menu
摘要： 效果 参考: Youtube – Responsive Navigation Menu Bar + Hamburger Menu Toggle - Only with CSS Youtube – Making an animated hamburger button and a challenge 阅读全文
posted @ 2022-03-08 22:20 兴杰 阅读(100) 评论(0) 推荐(0)
2022年3月6日
Facebook – Facebook Page Embed
摘要： 前言 在网站嵌套 Facebook 专页是很好的推广方式哦. 虽然网站还是需要做 Blog, 但是通常被订阅的都是 Facebook 专页而不是网站 Blog. 开通账号 它的 setup 很简单, 去 developers.facebook.com 注册一个开发者账号, 然后做一个 App 给网站 阅读全文
posted @ 2022-03-06 15:08 兴杰 阅读(149) 评论(0) 推荐(0)
2022年3月5日
HTML & CSS – Styling List
摘要： 前言 ul > li 经常会用到, 它原本的 style 很丑, 这篇介绍如果修改它. 以前学 W3Schools 的时候也有记入过: HTML – W3Schools 学习笔记 参考: Youtube – HTML & CSS for Beginners Part 17: How to Creat 阅读全文
posted @ 2022-03-05 18:17 兴杰 阅读(284) 评论(0) 推荐(0)
CSS – Logical Properties
摘要： 前言 续上一篇介绍了各种语言的阅读方向. 这一篇来讲一下 Logical Properties. 它与 left to right, right to left, horizontal, vertical 息息相关. 参考: Youtube – Write better CSS using logi 阅读全文
posted @ 2022-03-05 14:10 兴杰 阅读(247) 评论(0) 推荐(0)
HTML & CSS – dir, direction, writing-mode, ltr (left to rigth), rtl (right to left)
摘要： 前言 世界上有很多语言的阅读方向是不同的. 英文 中文 (以前才有竖排文字, 现在中文和英语一样了) 阿拉伯文 (Arabic) 面对不同的语言, HTML 和 CSS 就需要不同的写法. 虽然我没有做过类似的项目, 但是知识还是要有的, 正所谓 "没吃过猪肉，也见过猪跑" 嘛. 参考: HTML 阅读全文
posted @ 2022-03-05 10:33 兴杰 阅读(519) 评论(0) 推荐(0)
上一页 1 ··· 19 20 21 22 23 24 25 26 27 ··· 69 下一页