展开菜单

CSS3实现歌词进度文字颜色填充变化动态效果

CSS3实现歌词进度文字颜色填充变化动态效果

播放音乐时,歌词会随歌曲的进度逐渐填充颜色,不是逐字改变颜色,而是从左向右横向逐个像素改变的,也就是说会出现一个字的左右两边是不同颜色的效果。 这个效果通过CSS3可以实现。 实现思路: 1、background填充一个背景颜色,以及要变化的颜色 2、-webkit-background-clip:text;裁剪出文字的背景,即是楼空文字的意思 3、-webkit-text-fill-color:transparent;把裁剪缕空的文字弄透明,这样就可以通过缕空的形状看到背景颜色,这时背景颜色就是字体的颜色 ...

jquery设置指定value值的select下拉选中状态

定义一个value,在select下拉选项选中与该值相同的option,设置为选中状态。 html代码 <div class="setSelect"> <select> <option value="1">阿里云</option> <option value="2">腾讯</option> <option value="3">网易</option> <option value="4">百度</option> </s...

jquery指定option文本值设置select下拉选中状态

通过:contains匹配select下拉选项的option文本值,把和指定文本相同的option设置为选中状态。 html代码 <div class="setSelect"> <select> <option value="1">阿里云</option> <option value="2">腾讯</option> <option value="3">网易</option> <option value="4">百度</option...

CSS3响应式自适应尺寸视窗单位vw、vh详解

vw、vh、vmin、vmax是CSS3新增的视窗单位,同时也是相对单位,它相对视窗(Viewport)大小的百分比。 什么是视窗? 视窗即Viewport,是浏览器实际显示内容的区域,不包括工具栏、地址栏、书签栏。 视窗单位说明 vw - 视窗宽度的百分比,如1vw即浏览器可视窗口宽度的1%,10vw即窗口宽高的10% vh - 视窗高度的百分比,如1vh即浏览器可视窗口高度的1%,10vh即窗口高度的10% vmin - 选择当前 vw 和 vh 中的最小值,最小值被均分为100单位的vmin...

点击复制链接jQuery插件clipboardjs

clipboardjs插件可以实现点击文本复制到剪贴板的效果,常见的应用有点击复制链接。clipboardjs插件小巧简单,压缩后仅有11KB大小,且没有过多的配置,不依赖Flash以及任何臃肿的框架,且兼容性好,基本支持目前主流的PC端和手机端浏览器,如IE9+、Chrome 42+、Edge 12+、Firefox 41+、Opera 29+、Safari10+ 插件官方: 1、插件下载 https://github.com/zenorocha/clipboard.js/releases 2、使用示例: 示例一 ...

微信小程序获取data:{}变量时报错xxx is not defined

在data:{}声明初始化了一个变量,在onLoad:function()函数调用时,出现“xxx is not defined”错误,原因是直接使用了变量名,没有使用获取页面data对象的this.data 会报错的原代码: Page({ data: { text:'Welcome' }, onLoad: function(options){ console.log(text); }, }) 正确写法 Page({ data: { text: 'Welcome' }, onLoad: function...

解决windows IIS服务器MP4视频不能播放的问题

解决windows IIS服务器MP4视频不能播放的问题

确认MP4视频已经上传至服务器,视频URL无法打开,视频不能播放,那么一般是IIS没有指定MIME类型,这类文件默认在IIS里是不能下载的。 添加MP4视频MIME类型步骤 打开IIS 在 xx本地服务器上“右键 -> 属性”然后在“MIME类型"中查看已经的MIME格式 需要IIS支持 MP4 文件下载可以这么设置: PS:这里对IIS全局进行设置、如果只针对某一个站点可以直接设置站点的 2、在打开的“网站 属性”上选择“HTTP 头”再点“MIME类型按钮” ...

Linux CentOS zip unzip命令安装及参数详解

CentOS的zip、unzip命令分别用于压缩和解压zip文件。 安装命令 可以一起安装 yum install -y unzip zip 也可分别单独安装 yum install -y unzip yum install -y zip zip命令 作用:zip是个使用广泛的压缩程序,文件经它压缩后会另外产生具有.zip扩展名的压缩文件。作用是压缩文件为.zip文件。 语法: zip [-AcdDfFghjJKlLmoqrSTuvVwXyz$][-b <工作目录>][-ll][-n ...

js简单实现数字位数不够前面补0的方法代码

数字按个位数递增,没达到十位数或更高位数时,数字前面自动补0,如01、02、03、……、10、11如此类推,可以通过js代码实现。 代码示例 var _n = 1; //初始数 var _m = 2; //最高位数 var _a = Array(_m); //长度为2的空数组 _a = _a.join(0); //使用0隔开空数组,且把数组转换成字符串,结果是00 _a = _a + _n; // 拼接字符串,结果是 001 _a = _a.slice(-_m); //截取保留最后面2位字符串(slice(-2)表示从后面往前面数2位) console.lo...

js+canvas鼠标悬停圆弧边框动态加载效果

js+canvas鼠标悬停圆弧边框动态加载效果

鼠标悬停在div元素时,实现圆弧边框加载效果。 HTML代码: <div class="btn"> <canvas width="44" height="44" id="btn"></canvas> </div> CSS代码: .btn {width:44px;height:44px;border-radius:50%;border:1px solid #f00;cursor:pointer;} .ctxBtn canvas {position:absolute;left:0;top:...

.htaccess实现全站http 301跳转到https

开启HTTPS加密访问,但HTTP依然可以正常访问,出于SEO考虑,可把HTTP 301重定向至HTTPS,使用linux apache主机的网站,可以通过.htaccess实现。 在网站根目录下的.htaccess文件添加以下代码 RewriteEngine On RewriteBase / RewriteCond %{SERVER_PORT} !^443$ RewriteRule ^.*$ https://%{SERVER_NAME}%{REQUEST_URI} [L,R=301]