Swiper幻灯片插件实现video视频播放结束再继续轮播的代码
使用Swiper.js轮播图插件实现当前活动块元素有video视频时swiper停止自动切换，监听视频播放结束再继续自动切换到下一个的效果。实现该效果需要用到swiper事件有slideChangeTransitionEnd(swiper)、用到swiper的方法有mySwiper.autoplay.stop()、mySwiper.autoplay.start()。
实现代码
HTML代码
<d...
百度编辑器UEditor单独调用附件上传功能组件的代码
UEditor编辑器有上传附件的组件，如果网站有使用UEditor编辑器，又想在编辑器窗口外单独调用UEditor的上传附件功能，可以参考下面的代码。
HTML代码
<div class="uploadfile">
<input name="file" id="file" type="text" class="uplod_file" value="" />
<span cl...
解决Less下使用CSS calc函数px按%计算导致结果错误的问题
在Less中使用CSS函数calc()动态计算长度值时出现错误，原本是px像素单位的数值被当成%百分比单位来计算，导致计算结果不正确。
Less代码：
.calc {
width:calc(100% - 90px);
}
编译后的CSS代码：
.calc {
width:calc(10%);
}
原因是less对代码进行了转换编译，解决方法是使用 “~''” 符合禁止对其编译，让...
jQuery $.ajax请求本地文件数据的返回值是字符串的解决方法
使用 $.ajax 请求本地静态文件数据，数据明明是JSON格式，但返回值的数据类型却是字符串，这是因为在数据传输过程中，JSON是以文本（即字符串）的形式传递的，所以返回的值也就是字符串类型，因此在操作返回的JSON数据时，需要先把JSON字符串转换为JSON对象，也就是解析，即反序列化（简单地理解）。
涉及基础
简单地理解，序列化就是把JSON对象转化成JSON字符串类型的过程；反序列化则是把JSON格...
SuperSlide.js插件实现当video视频播放完后再切换下一张
在修改网页的焦点图效果：当前焦点是视频的时候，暂停焦点图的自动轮播，当视频播放完成后再启用焦点图的自动轮播。查看代码发现该焦点图使用的是 SuperSlide.js 插件，这是一款存在时间挺长的 jquery 焦点图插件，但多年的更新，插件的参数还是不够丰富全面，一些效果实现起来会比较麻烦。不过庆幸的是 SuperSlide.js 插件有提供 startFun 和 endFun 函数。
温馨提示：以下代码适用于 Sup...
控制CSS animation动画暂停或运行的样式属性animation-play-state代码
animation 动画是经常会使用到的CSS3样式属性，通常是用来运行 @keyframes 定义动画，在网页开发过程中，想暂停 animation 动画要怎么做？CSS3 提供了 animation-play-state 属性，该属性的作用是运行或者暂停动画，支持该属性的浏览器版本 Chrome 43+(4.0 -webkit-)、IE10+、Firefox 16+(5.0 -moz-)、Safari 9.0+、Opera 3...
带完整省市json数据的jquery省市二级联动代码
做表单涉及到地址地区时，经常需要做地区联动，比如省市二级联动、省市县三级联动以及更深层次的省市县镇街道联运等，下面的代码是最常用到的省市二级联动，附带了完整的json数据，其实做地区联动不难，麻烦的是弄对应的地区数据。
引入省市数据文件
把json数据保存为area.js文件后，引入文件（json数据太长，放在文章末尾了，请在文章末复制）
<script src="area.js">&l...
响应式javascript堆叠式轮播图切换的实现代码
三张图堆叠式立体轮播图效果在网页前端开发过程中经常会做到，之前不想费心费力自己弄，习惯使用一些成熟的jquery轮播图插件（如slick.js、Owl-Carousel.js）改造实现，效果也算是差强人意。这次在bilibili上看到有人分享相同效果的代码，下载下来发现代码挺简单，效果也比较合适，于是就在原代码的基础上对html、css和js都进行了些小修改，结果比较符合自己的要求。
HTML代码：...
给浏览器F12控制台添加提示文字的代码
通过审查元素或者直接F12键打开浏览器控制台默认是空白的，但可以通过javascript代码的console.log给它添加一个带样式的提示内容，支持Firefox、Chrome、Edge（不支持IE系列）等浏览器。
代码
if (window.console) {
console.log("%c掏点东西（https://www.tddx.net）","color:#fff;...
支持IE/Chrome/Firefox浏览器的网页打印javascript代码
点击网页某个元素，调用window.print()方法，打印功能，打印指定元素内的内容，经测试支持Firefox、Chrome、IE9+浏览器。
提醒：IE需要在Internet选项的安全设置中【自定义级别】的“对标记为可安全执行脚本的 ActiveX 控制执行脚本*”设置为启用。
html代码
<div id="entry">
此处是要被打印的内容！
</di...
javascript通过浏览器滚动条滚动方向判断鼠标上下滚动的函数代码
制作网页时，需要判断鼠标向上滚动还是向下滚动，首先想到的是通过 jquery.mousewheel.js 插件实现，但如果浏览器滚动条是正常状态，也可以通过滚动条的滚动位置来检测鼠标是向上滚动还是向下滚动，实现思路比较简单，就是比例滚动条滚动前后的位置变化即可。
函数代码：
function mouseScrollDirection ( fn ) {
var beforeScrollTop = do...
原生javascript获取指定对象所有子孙元素集合的代码
不限制层级、不区分标签名、不区分样式名，通过原生javascript代码获取所有子元素，包括子元素的子元素（孙元素）的集合，可以通过定义一个数组，然后多次嵌套使用javascript的children属性获取子元素存储到数组来实现，代码很简单，效率不详！
代码示例
HTML代码
<div id="tddx-entry">
<p>
<span></sp...
