- 博客(40)
- 收藏
- 关注
原创 CSS mix-blend-mode实现 Logo(图片)根据图片后面的图片颜色而变化成相反的颜色【解决logo固定后 会出现与不同板块的颜色相同导致于看不清logo的情况】
logo 随着 logo后面的板块颜色而变化成对应的翻转色。(一般用于logo 固定在某个位置 与板块重叠后看不清的情况)
2023-02-23 18:04:58
762
原创 jq-颜色选择器 所见即所得
<input type="color" oninput="seget()" id="bgColor"> <p></p> <script type="text/javascript"> $('#bgColor').bind('input propertychange', function () { // console.log($(this).val()); let bgCol = $(this).val(); ..
2022-04-27 13:54:44
365
原创 Jq-实时获取Input 的值
<body> <input type="text"> <p></p></body> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript">
2022-04-27 11:45:48
1116
原创 CSS filter 白色文案透明底图片 转换 任意颜色文字图片
<!-- 白色文案透明底图片 转换 任意颜色文字图片 --><!-- 1. 我们使用想转换的图片放入img内2. 先用filter把他转换为白色 CSS filter滤镜任意色值转换工具地址:https://www.zhangxinxu.com/sp/filter.html3. 当鼠标划入时 展示原图 取消filter属性补充:有余颜色转白色最为简单,所以不建议图片为白色然后转换其他颜色操作,图片应当是想转换的颜色,然后用代码更改操作--> <style t
2022-04-18 18:39:39
952
原创 jquery 滚动条的隐藏与展示
// html 滚动条显示 $('html').css({ "overflow-x":"auto", "overflow-y":"auto" }); // html 滚动条隐藏 $('html').css({ "overflow-x":"hidden", "overflow-y":"hidden" }); // 可根据自己的代码来操控滚动条的展示...
2022-04-06 11:35:28
1387
原创 jquery 实现图片预加载
<script type="text/javascript"> // 预加载 function preloadImg(list, imgs) { var def = $.Deferred(), len = list.length; $(list).each(function(i, e) { var img = new Image(); img.src = e; if (img.complete) { imgs[i] = img; len--;
2022-04-06 11:17:37
1761
原创 jquery 点击按钮 实现按下去的效果
<div class="downloadImg"> <img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic.51yuansu.com%2Fpic3%2Fcover%2F01%2F01%2F91%2F58de87033fe22_610.jpg&refer=http%3A%2F%2Fpic.51yuansu.com&app=2002&size=f9999,10000&q=a80&a
2022-03-31 17:44:24
2052
原创 jquery 实现吸顶效果代码(导航)
如果滚动大于50,就改变导航的定位方式(根据窗口定位固定,距离顶部0px 吸顶,宽度100%),否则就默认(绝对定位 并与头部 70像素)$(function(){ $(window).scroll(function(){ if($(window).scrollTop()>50){ $("#nav").css({"position":"fixed","top":0,"width":"100%"}); }e
2022-02-23 10:18:37
998
原创 点击出现烟雾
示意图<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <style type="text/css"> body{ background-color: #000000; } #hi{ pos
2021-12-20 17:48:41
133
原创 body溢出空白元素解决
<style type="text/css"> html{ display: block !important; overflow: scroll; } </style>
2021-09-28 14:09:22
658
原创 删除a标签 href里特定的值
<script type="text/javascript"> // 找到需要更改的a标签 获取href var arr = $('a').attr('href'); //修改 arr内容里带有/news 的字符串(此内容是a标签的href值) var uarr = arr.replace('/news', ''); // 最后插入到a标签中 $("a").attr("href",parr); console.log(parr); </script>.
2021-09-27 16:27:11
478
原创 解决 网站404 Not Found 错误
编辑修改.htaccess文件RewriteEngine on<IfModule mod_rewrite.c>RewriteBase /RewriteCond %{REQUEST_FILENAME} !-fRewriteCond %{REQUEST_FILENAME} !-dRewriteRule . /index.php [L]</IfModule>
2021-08-12 14:41:47
8672
原创 CSS 实现 Input 的动态样式美化
展示效果:结果: 如果显示占位符,则为边框为5px的红色,表示用户未输入任何内容 如果未显示任何占位符,则为默认白色,表示用户已键入内容使用CSS 中的 :placeholder-show 伪类完成此操作。什么是 :placeholder-showCSS :placeholder-shown伪类用于确定元素是否显示占位符的对象(占位符表示input 内设置placeholder 的值),主要使用它来检查input内容是否为空。换句话说,根据用户在文本框(input,textarea)输入的内容
2021-08-03 15:06:38
1280
原创 PHP Code码生成
/** * 生成随机数 * @param $len * @return string */ public function GetRandStr($len) { $chars = array("A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z","a", "b", "c","d", "e",
2021-07-26 10:28:19
389
原创 fastadmin api 跨域、 403 问题
1、Api基类中添加header信息header("Access-Control-Allow-Methods: *");if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS'){ // 浏览器页面ajax跨域请求会请求2次, // 第一次会发送OPTIONS预请求,不进行处理,直接exit返回, // 但因为下次发送真正的请求头部有带token, // 所以这里设置允许下次请求头带token否者下次请求无法成功 header('Ac
2021-07-26 10:24:38
644
原创 swiper动态加载数据滑动失效,ajax执行后swiper.js的效果消失问题
swiper动态加载数据滑动失效,ajax执行后swiper.js的效果消失问题$.ajax({ type:"get", url:finalUrl, dataType:"json", success:function(data){ $("#reportList").empty(); for(var i=0;i<reportLength;i++){ var url="'"+"reportDetial.html"+l
2021-07-26 10:21:28
199
原创 CSS 2端对齐 并 居中展示
/*下面是css 样式*/selector{ text-align: justify; text-align-last: center;}
2021-06-28 14:46:25
93
原创 CSS 实现背景图片 设置响应式自适应全屏展示
img标签 设置响应式自适应全屏展示最终效果最终代码最终效果由此图可以看到无论网页缩放与放大网页都不会影响到这张图片的尺寸。在放最终代码之前注意:图片建议一定要大于显示器屏幕,建议为1000左右甚至更高。(如果是小于屏幕的情况下把图片铺满屏幕会出现图片变形的情况)最终代码<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport"
2021-06-21 17:08:56
1767
原创 js阻塞
js阻塞介绍需了解的东西1. 异步编程概念2. Js 单线程渲染线程和JS线程解决Js 阻塞问题介绍本文将介绍 js 阻塞的相关知识,以及解决办法需了解的东西1. 异步编程概念异步是什么?简单来说就是把要执行的东西在某个时间段内一块执行。2. Js 单线程众所周知Js 的执行是从上至下的,Js同一个时间只能做一件事。所有任务需要排队,前一个任务结束,才会执行后一个任务。 如果前一个任务耗时很长,后一个任务就会等着前面的任务执行完成再执行。渲染线程和JS线程两个任意一个在运行的时候,另
2021-04-30 16:25:02
1095
2
原创 Js 延迟加载
延迟加载对于js 失效 的都可以使用延迟加载解决setTimeout(function() { 这里写代码 }, 5000); //5秒后将会执行{}括号内的代码
2021-04-29 11:55:03
109
原创 Excel 中 实现删除特定字符前面的所有内容
最终展示如下图:函数代码=RIGHT(A1,LEN(A1)-FIND(":",A1))使用流程随便选择一列,我那b1为例复制函数并回车完成
2021-04-06 14:25:17
9311
原创 将网页class 为 textp 的所有信息单独弄出来放在一个元素内
<body><p class="textp">这里是信息1</p><p class="textp">这里是信息2</p><p class="textp">这里是信息3</p><p class="textp">这里是信息4</p></body><script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jqu
2021-03-31 15:51:31
177
原创 jQuery 实现鼠标滚动图片 放大缩小
<!DOCTYPE html><!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title></title> <link rel="stylesheet" href=""> <script src="htt
2021-03-30 16:41:46
1266
2
原创 wordpress 无法上传 .webp 图片格式的解决方法
具体操作找到放在服务器的项目文件进行编辑,一般情况下wordpress 后台是没有权限编辑的编辑文件 /wp-includes/functions.php1. 打开function.php 文件后搜索下方字符(Ctrl+F键)‘image/jpeg’ => ‘jpg’,在下面array 内加入‘image/webp’ => ‘webp’,如下图:2. 继续搜索下方字符‘jpg|jpeg|jpe’ => ‘image/jpeg
2021-03-29 16:23:15
1650
原创 CSS 实现禁止复制某块区域文字
展示效果代码:<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title></
2021-03-29 09:47:28
131
原创 前端网页遇到字体溢出,需用到字体比12px 更小的解决方法
scale整体缩放transform: scale(这里填写数字,默认值为1;大于数字1 代表放大,小于1代表缩放(如0.6));可用来处理任何难以再变化尺寸的元素;<style type="text/css"> //把选中的div下元素整比例的缩放,如果元素里包含文字一并缩放,注:元素一定要有宽高,盒子元素 div{transform: scale(0.6);}</style>再随便打开一个网页F12 测试下(如下图):...
2021-03-29 09:33:58
453
原创 前端实现点击弹出视频展示模块
最终效果代码<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>点击按钮展示
2021-03-27 16:23:31
2541
3
原创 jQuery 滚动条获取(滚动某位置距离显示/隐藏元素)
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title></title>
2021-03-25 17:55:10
655
原创 jQuery 实现数组分组展示
jQuery 实现数组分组展示 // 创建一个对象数组 var obj = [ {'id':'1','name':'name1','age':'21'}, {'id':'2','name':'name2','age':'22'}, {'id':'3','name':'name3','age':'23'}, {'id':'4','name':'name4','age':'55'}, {'id':'5','name':'name5'
2021-03-25 17:38:30
1605
原创 jQuery 获取不到 textarea,值为空问题
使用jQuery 的val(); 获取;如:html:<textarea name="con" type="text" id="Rtest"></textarea>jq:var textarea = $("#Rtest").val();注意:一定要在html 中的textarea标签中加入 type="text" 这个属性,,不然就获取不到数据。...
2021-03-13 09:58:09
2189
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人