owl carousel是款响应式的轮播图插件，功能完善，参数丰富，使用该插件可以实现各种轮播切换效果，比如时间轴型的公司发展历程。效果如下： 下面代码基于jquery-3.3.1和Owl Carousel v2.3.4版本实现，插件文件可以在GitHub下载。 Github主页：https://github.com/OwlCarousel2/OwlCarousel2 1、引入插件文件： <link rel="stylesheet" type="text/css" href="owl.carousel.min.css" m...
禁止浏览器窗口滚动的同时保留滚动条，以及滚动条被禁止滚动后，再次启用滚动条滚动的jquery代码如下： /**禁用滚动条**/ function unableScroll() { var top = $(document).scrollTop(); $(document).on('scroll.unable',function (e) { $(document).scrollTop(top); }) } /**启用滚动条**/ function enableScroll() { $(document).unbind("scroll.unable");...
在.shtml静态页面中使用#include可以引入另一个html文件，从而实现做静态整站html网页时，实现公用文件的提取，被包含的文件可具有任何文件扩展名，不少人喜欢使用.inc扩展名文件。 注意： 使用#include命令必须开启服务器的ssi服务（全称Server Side Include），即使用映射到SSI解释器的文件扩展名，否则Web服务器是不处理该命令的。 默认情况下，扩展名.stm、.shtm和.shtml将映射到解释器 (Ssinc.dll)。如果安装了Internet服务管理器，则可以修改默认扩展映射并添加新的映射。 ...
$.inArray()方法用于在数组中搜索指定的值，并返回数组中该指定值的索引值，如果数组中不存在指定的值，则返回-1。 语法 $.inArray( value, array [, fromIndex ] ) 示例一： 返回索引值 var arrayStr = ['a','b','c']; alert($.inArray('a', arrayStr)); 返回索引值为0 示例二： 判断指定值是否存在 var arrayStr = ['a','b','c']; if($.inArray('a',a...
bxSlider.js是一款jquery轮播图插件，可以实现图片并排轮播切换；zoomsl.js是一款jQuery图片放大镜效果插件，可以实现鼠标悬停放大显示图片细节；两个插件结合就可以实现类似于淘宝商品页页的产品轮播和放大显示效果。 bxSlider Github：https://github.com/stevenwanderski/bxslider-4 zoomsl下载：免费可商业商品图片放大镜jquery插件zoomsl.js 实现代码 引用插件： PS：自行前往官网或Github下载jQuery库、...
俄罗斯的一款商品图片放大镜jquery插件，类似于淘宝商品在鼠标悬停上去，右侧显示细节放大镜窗口。zoomsl插件兼容IE8+、Chrome 1+、Firefox 2+、safari 2+浏览器。商业许可及个人许可均免费。 插件下载：jquery.zoomsl.plugin.zip 插件教程 基础应用 HTML代码结构： <img class="my-foto" src="/images/image1-small.jpg" data-large="/images/image1-big.jpg" title="...
不依赖javascript，直接使用纯css实现svg的描边绘制动画效果，效果演示动画。 基础知识： SVG中有个比较重要的属性分支stroke，中文软件中称为“描边”。和stroke相关的属性还有下面这些： 1、stroke 表示描边颜色。表示颜色的名字不是stroke-color，只是单纯的stroke。它的值官方称为“paint”，可选值的类型包括none、currentColor、<color>。 none - 表示没有颜色； <color> - 表...
html中table没有直接的斜线表头标签，但结合css、svg之类的可以实现。 先看效果： html代码： <table style="border-collapse:collapse;" cellspacing="0" cellpadding="0"> <tbody> <tr> <td id="lineTd"> <span style="float:left;margin-top:20px;">项目</span> <sp...
使用jquery.form.js插件，提交表单的时间，提示错误$.handleError is not a function的错误，完整错误如下： TypeError: $.handleError is not a function jquery.form.js:339:7 错误原因： $.handleError存在于jQuery-1.4.2之前的版本中，jQuery-1.4.2之后的版本废弃了$.handleError 解决方法： 1、把jquery.js库换成1.4.2之前的版本。（不推荐该方法） 2、在...
jquery验证表单插件出现错误提示，无法提交表单，错误提示如下： Error: Syntax error, unrecognized expression: script:[websiteurl] 该错误出现在jQuery 1.4以后的版本。 解决方法： 编辑submitform_validator.js文件，把代码中的所有script:[websiteurl]修改成script[websiteurl]即可。
外边距属性margin和内边距属性padding取百分比值的时候，无论是left、right或top、bottom，都是以其父元素的宽值(width)作为参照物（即分母top/width），这是W3C的规范，官方原文如下： Note that in a horizontal flow, percentages on ‘margin-top’ and ‘margin-bottom’ are relative to the width of the containing block, not the height (and in vertical flow, ‘margi...
video是HTML5的一个视频媒体标签，其作用是在网页中嵌入指定的视频，video标签的代码结构及参数如下。 HTML代码结构： <video controls autoplay loop preload="auto" poster="img/popup-img.png" webkit-playsinline="true" playsinline="true" x5-video-player-type="h5" x5-video-player-fullscreen="tr...