前端笔记共6篇
前端基础
使用getBoundingClientRect()在页面中点击事件平缓跳转到锚点并偏移定位-钻芒博客

使用getBoundingClientRect()在页面中点击事件平缓跳转到锚点并偏移定位

介绍 使用getBoundingClientRect()方法获取目标元素的位置信息,包括元素的上边缘相对于视口顶部的距离。然后,将视口的垂直偏移量window.pageYOffset与偏移量参数进行计算,得到最终的滚动位置...
Alextao的头像-钻芒博客赞助会员Alextao12个月前
0310
一个js弹窗,点击按钮会出窗口,点击x或空白区域或关闭窗口。-钻芒博客

一个js弹窗,点击按钮会出窗口,点击x或空白区域或关闭窗口。

截图 点击按钮会出窗口,点击x或空白区域或关闭窗口。 代码 <style> .overlay-tecgic { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color...
Alextao的头像-钻芒博客赞助会员Alextao12个月前
0180
自建 PHP获取网站描述Description API接口-钻芒博客

自建 PHP获取网站描述Description API接口

最近在开发一款AIGC网址导航,带有网址投稿功能,因为后台添加导航比较繁琐(虽然只有几个字段),我也常常用前台的投稿功能然后再去后台审核下。 提交的网址涉及几个常见字段,titile、描述、U...
Alextao的头像-钻芒博客赞助会员Alextao9个月前
03440
自建 PHP获取网站标题Title API接口-钻芒博客

自建 PHP获取网站标题Title API接口

Tips:本文是「自建 PHP获取网站描述Description API接口」文章的孪生兄弟,结构文案都差不多,只是api代码有点区别。 最近在开发一款AIGC网址导航,带有网址投稿功能,因为后台添加导航比较繁...
悬浮彩色渐变 Button 按钮-钻芒博客

悬浮彩色渐变 Button 按钮

HTML:<button> Button </button>CSS:button { background-color: #444141; border-radius: 4px; color: #fff; cursor: pointer; padding: 15px 30px; font-size: 18px; font-weig...
anywayuan的头像-钻芒博客🌍知识星球会员anywayuan7个月前
01880
不一样的 Button 按钮-钻芒博客

不一样的 Button 按钮

先看效果:HTML:<button> <svg height='36px' width='36px' viewBox='0 0 36 36' xmlns='http://www.w3.org/2000/svg'> <rect fill='#fdd835' y='0' x='0' height='36' width='...
anywayuan的头像-钻芒博客🌍知识星球会员anywayuan7个月前
02363