共享博客 - 简单搜索

音频视频的语法标签以及相关的html属性

2024年04月03日音频语法：<audio controls loop autoplay> <source src="音频文件路径" type="audio/mp3"/> </audio> 注：音频相关html属性 1. controls 添加音频控制条 2. src 引入音频文件路径 3. autoplay 设置自动播放 4. loop

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

html5新增的表单type新属性值

2024年04月03日 1. 限制用户输入必须为邮箱类型type="email" 注: 必须含有@，@前后内容不能为空2. 限制用户输入必须为url地址type="url" 注: 必须含有http: ,并且http: 后面要有内容3.限制用户输入必须为数字type="number" eg:<input type="number" max="30" min="1&quo

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

html5新增表单新属性

2024年04月03日 1. required 为必填项，不能为空<input type="text" required="required"/> 注: 可以省略属性值 required2. placeholder 给input控件添加一个默认提示信息<input type="password" placeholder="请输入密码"/>3. autofocus 页面加载完成后自动聚焦到某个

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

html利用font-family引用自定义的字体

2024年04月03日气死了，哎！刚开始我引入的ttc字体格式，应该是不支持吧！我以为代码有问题，搞了半天，最后下载了一个ttf字体，就OK了！附代码如下:<style> @font-face { /*自己起个名称，FontName是我起的，可修改*/ font-family: "FontName"; /*url引入字体路径*/ src: url('tp.ttf') format(&#

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

2024年04月03日 1. 百分比布局特点: 不管分辨率怎么改变，头部的高度和位置都不变，文字流式，控件弹性，图片等比例缩放适用于内容较少，比较简单的移动端页面2. 等比例缩放布局（rem布局）特点: 使用 rem 为主要单位进行页面布局，很好的实现了在不同设备上页面等比例缩放适用于页面内容比较复杂的移动端页面3. 混合式布局特点: 混合布局是指将多种布局方式融合在一起实现移动端的屏幕适配的方法

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

css3 greyscale实现去色 css3实现图片或页面变为黑白效果

2024年04月03日今天帮朋友看一效果，看到了手标滑过图片变为彩色的效果，很简单又兼容各大浏览器的，无非是准备两张图，一张黑白，一张彩色，滑过切换背景图或直接切换图片方法，当然，谁也不想这么复杂操作。下面用css3安排下：给标签加上下方css代码，即可变为黑白，也就是去色filter: grayscale(100%); filter: gray;安排下兼容写法-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%);

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

微信公众号开发获取所有关注用户的openid 以及对应的用户信息

2024年04月03日我们获取到 access_token ，接下来我们要用 access_token 来获取所有用户的 openid首先，第一步，如果我们的公众号粉丝低于10000，可直接调用下方接口，拿到所有用户的列表以及openidget请求ACCESS_TOKEN 参数修改成以获取的参数值，安排最终拿到所有用户的列表，如下{ "total": 18000, "count": 10000, "data"

前端 JS JavaScript

webAPP使用mui修改手机自带back虚拟按键触发返回或退出

2024年04月03日做了一个小型webAPP，打包生成安装包安装到手机之后，安卓自带物理返回键，每次只要触碰了，APP就直接退出了，刚好用的 mui ，于是查了下mui修改物理返回键，代码如下<script> mui.init({ keyEventBind: { backbutton: true //关闭back按键监听 } }); //首页返回键处理 //处理逻辑：0.5秒

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

给网站添加统计网站运营时间效果代码

2024年04月03日今天看到很多博客，有一个统计网站运营时间，突然也想给网站添加那么一个，于是网上也整理了一个，稍作修改。目前样式没有去写，改天有空我会再次更新本文。HTML代码，我们将它放置网站需要显示统计时间的地方<span id="share_time" style="color: red; font-weight: bold;"></span>JS代码，我们将它放置网站公共js文件，或者放置到只要能让上方ht

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

vue中如何动态设置当前页面的网站标题

2024年04月03日首先我们在 router 下 index.js 注册一个全局指令//设置网页标题全局指令 Vue.directive('title', { inserted: function(el, binding) { document.title = el.innerText el.remove() } }) 然后，我们想要修改标题的页面组件中调用刚才注册的指令<div v-title>

前端 JS JavaScript vue

vue中使用QRCode来实现将内容生成二维码功能修改QRCode生成二维码的颜色

2024年04月02日第一次看到QRCode.js，就顺便试用一下，还挺方便的，就给大家简单分享一下具体他是干嘛的，还有什么功能，自行百度去，在这只演示一下生成二维码。首先，我们通过如下命令，安装一下npm install --save qrcodejs2 安装好之后，我们在当前页面组件中引入import QRCode from 'qrcodejs2'; 接下来再 methods 中写入下方代码methods: { qrcode ()

前端 JS JavaScript vue

VUE中使用插件实现点击图片放大功能

2024年04月02日今天看到vue中一个很不错的图片点击放大插件，分享给大家首先，我们运行命令安装接着我们在 main.js 中引入// 引入放大插件 import vueDirectiveImagePreviewer from 'vue-directive-image-previewer' import 'vue-directive-image-previewer/dist/assets/style.css' Vue.use(vueDirectiveIma

前端 JS JavaScript vue

使用c3动画给自己网站添加一个动态闪光logo

2024年04月02日今日公司UI小姐姐浏览某网页，看到网页logo的闪光效果，然后建议我也可以给网站做一个，我看了下效果，之前也在部分网站看到过，效果也不错，今天就用c3动画给大家分享一个，先看效果如下首先，我们需要找到自己网站logo外面套的盒子，给添加下方css代码，.logo 是我网站logo盒子的类名，大家用自己的就行/*首先我们需要给logo的盒子设置相对定位，设置宽高，并超出部分隐藏*/ .logo{ position: relative; w

懒猪前端开发前端博客个人博客网站制作鹏仔先生百变鹏仔 HTML CSS javascript JS

JS如何获取最近30天的日期，并存放到数组里

2024年04月02日最近做项目，需要获取到近30天的日期来获取对应的内容，如下图写了个demo，加了些拼接判断，拼接成 01-01这种类型，如下代码，代码有点杂乱，反正需求是出来了，如果有什么更简单的，欢迎评论留言。// 获取月日 let times = new Date(); let Y = times.getFullYear(); let M = times.getMonth() + 1; let D = times.getDate(); let MD = ""

前端 JS JavaScript

vue+微信公众号开发网页授权返回url路径中带#不识别，无法授权解决方案

2024年04月02日早期文章，年少轻狂，懂得少，下面文章已经废除，授权直接去除#就行。带个#可真是坑啊！！！第一次开发微信公众号，原本看起来并不复杂，前端负责调接微信接口的地方很少，为了安全起见，大部分接口都是由后端处理，前端只需负责调通后端接口即可，当然还有少部分需要前端来处理。在微信公众号开发中，网页授权第一步需要用户同意授权，获取code ，微信官方提供的获取code接口如下（具体接口介绍请查看微信开发者文档）其中 redirect_uri 是我们需要拼接的路径地址，通过走微信接口，最后

前端 JS JavaScript vue