网页常用侧边栏悬浮客服小工具代码
随着网页滚动始终固定在侧边的客服小工具，用于显示在线咨询、联系电话、微信公众号、返回顶部等信息。HTML+CSS结合jQuery代码，可以实现鼠标悬浮或点击显示电话号码、二维码图片等。
代码效果：
HTML代码：
<div id="widget">
<ul>
<li>
<a class="p...
实现响应式web网页ctrl+鼠标滚轮等比缩放的js代码
使用非固定像素单位开发的响应式网页，如rem、vw等，使用ctrl+鼠标滚轮缩放时网页不会缩小，因为rem、vw大多会浏览器窗口宽度分辨率绑定，而ctrl+鼠标滚轮缩小，分辨率反应变化，所以网页不会等比缩小。但可以通过js+缩放比率来实现ctrl+鼠标滚轮等比缩小的效果，适用于使用了vw单位或者rem单位。
代码：
(function (doc, win) {
var docEl = doc.docum...
GSAP动画库实现无缝无限滚动跑马灯效果
网页图片跑马灯滚动效果的需求：均速无限滚动，无缝衔接滚动，鼠标悬浮暂停滚动，鼠标移动恢复滚动，可以向左或向右滚动。实现原理，利用gsap参数x和repeat。
效果如下：
HTML代码：
<div class="gallery">
<ul>
<li>
<a href="">
<img class="img"...
GSAP参数的箭头函数的运用方法和示例
(参数) => { 函数体 }是ES6中引入的特性，叫箭头函数，一种简洁的函数定义方式，在GSAP中利用箭头函数，可以实现更多变化的动画。
箭头函数有两种基本语法，分别是
(参数) => { 函数体 }
(参数) => 表达式
示例：
//一般函数
function add(a, b){
return a + b;
}
//箭头函数
const add = (a,...
通过execCommand命令实现一键复制文本的javascript代码
网页上实现一键复制的功能可以使用clipboardjs插件，也可以使用execCommand命令，但兼容性没有前者好。实现思路是创建一个表单文本输入框元素如input、textarea，然后使用select()方法选择文本，再使用execCommand命令复制文本到剪切板。
为了便于重复调用，写成一个函数
function tddx_copyText(ctext) {
var copyText = do...
canvas实现点击指定切换元素的圆形弧线进度条动画效果
这是一个使用画布canvas做的通过点击元素实现弧线运动到指定位置的动画效果。实现原理和前面分享的《Canvas百分比动画进度条》教程一样，区别是增加了一个点击事件来传递参数使弧线动画运动到指定位置。思路很简单，代码也很简单。
HTML代码：
<div class="canvas">
<canvas id="circle" width="644" height="640...
javascript封装$_GET函数来获取url的参数值
js获取通过window.location获取当前网址的参数（参考《javascript获取当前页面url网址参数信息代码》），如果需要频繁获取或者获取的参数较多，显得有点不方便。写成函数的方式，像php或其它代码那样直接使用$_GET['id']的方式获取参数值会更好。
var $_GET = (function(){
var url = window.document.location.href.toStrin...
通过swiper.js插件实现单边三张图片重叠轮播效果
常见的堆叠轮播效果，基于Swiper 8.4.7版本的创意效果参数effect: 'creative'实现。
HTML代码：
<link rel="stylesheet" type="text/css" href="../css/swiper-bundle.css" media="screen"/> <!--Swiper 8.4.7-->
<script src="...
简单javascript代码实现简单的天时分秒倒计时功能效果
常见的活动倒计时效果js代码，实现原理很简单，通过计算结束时间与当前的时间差实现倒计时，然后可以使用setInterval方法实现每隔1000毫秒（即1秒）变动一次剩余时间的动态倒计时效果。
HTML代码：
<div class="countTime">
<span id="day"></span>
<span>天</span>
<sp...
jquery实现粘贴16位序列号自动分割填入input的代码
常见的功能，复制验证序列号粘贴自动分割填入当前focus的input及后面input，每个框4个字符。同时实现当复制的内容自由分割后，某个input不足4个字符时，focus在那个input，超过4个字符则focus进入下一个input。
实现代码
HTML代码
<div class="serial">
<input type="text" class="text...
javascript数组转换成字符串的代码方法join()
Javascript join()方法用于把一个数组中的所有元素通过指定的分隔符进行分隔转换为一个字符串。join()方法为JavaScript版本增加，所有主要浏览器都支持。
语法：
array.join(separator);
参数
separator：可选，指定要使用的分隔符（如,-|等），留空则自由使用逗号作为分隔符。
返回值
String：返回一个字符串，该字...
解决HTML5 video不支持播放m3u8格式视频的方法
m3u8是一种基于HLS(HTTP Live Streaming)文件视频格式，HLS由苹果公司提出，使用<video></video>标签可以在Safari浏览器直接播放，但其它浏览器要借助hls.js或基于hls.js开发的html5播放器插件才能兼容播放m3u8格式视频，否则会提示不支持视频格式。
基础代码
HTML代码：
<script src="https://...
