CSS粘滞定位：页面滑动到某位置时使其固定不动，随父元素结束解除固定
先在父元素加上（如果没有父元素，可直接用body添加） position: relative; 然后在需要粘滞的元素加上 position: sticky; top: 0px; 即可生效。 需要注意的是： 父元素不能有overflow:hi...
PHP获取当前url链接的一些函数
示例链接：https://xulgr.com/test/xulgr.php?qq=2037555766 $_SERVER['SERVER_NAME'] //获取当前链接的主域名，输出结果：xulgr.com $_SERVER['SERVER_PORT'] //获取当前链接的端口号，输出结...
简单的JS实现选项卡Tab非同级切换
网上大部分选项卡代码是在同个父级下实现的，这样对前端比较难设计显示出来的样式，所以我就简单记录一下我设计的两个父级或者同级都能使用的选项卡代码。 思路 将所有选项按钮定义点击事件，然...
JS使用navigator.platform硬核判断移动端和PC端，调试器也判断
我之前发的一些JS或PHP判断用户浏览器或操作系统都是用navigator.userAgent标识头来判断，但如果PC端浏览器打开控制台开发者模式时可以通过模拟设备来改变成安卓手机或苹果手机端，这样userAgen...
JS判断浏览器宽度
$(window).width(); 注意此为JQ方法，需要引入JQ
父级和子级iframe的一些交互
一。子级iframe执行父级页面的一些操作 可以使用window.parent直接执行或调用父级的元素和函数 直接看这篇吧 二、父级执行子级iframe页面的一些操作 <iframe id='XulgriFrame' src='h...
响应式居中-在整个屏幕最中间的位置
方法一：具有固定定位的屏幕居中 .XulgrCenter{ position: fixed; top: 0; bottom: 0; left: 0; right: 0; display: flex; flex-direction: column; align-items: center; justify-content: cen...
将png或jpg图片制作成svg图标文件
一、下载安装Adobe Illustrator （AI） 关注后回复“AI”或“ai”免费下载Adobe Illustrator CC 2019安装包 二、使用AI制作 1.打开AI软件，按Ctrl+O打开文件选择你要制作图标的png或者jp...
CSS的Flex布局并排间距换行间距和每几个元素换行间隔
直接上例子，每4个元素换行并设置10px的间距 ul{ display: flex; flex-wrap: wrap; /*flex弹性换行*/ margin: -10px; /*父元素抵消掉子元素的间距*/ } ul li{ margin: 10px; /*子元素之间的间距...
简单的CSS+JS实现鼠标指针附带图标
html部分直接在body开头加上img图标地址即可 <img src='图标地址' class='xg-mouse'> 图标建议使用透明背景的png或svg CSS部分直接定义图标大小和绝对定位即可 .xg-mouse {width:40px;hei...
