以前写过一个这个效果，当时刚学js，所以很多东西都是自己写的，从现在的角度看，以前的写的未免不太好，因为平台不通用啊。所以这次我写了一个jq版本，相对来说通用很多，拿上就能用的效果，不多说，先上预览图：预览图源码直接把代码保存在新建的js文件中，然后在jq之后引入即可。[hide] ; jQuery(document).ready(function ($) { let fqIndex = 0; const fqArr = ["富强", "民主", "文明", "和谐", "自由&qu...

一直想搞个多语言切换的东西，想的头发都没了。终于让我看到了一个插件，虽然已经是很久以前的东西了，但是我测试了下，还真鸡儿好用。github地址: 官网引入文件，因为是jq的插件，所以在jq文件后面引入：<script src="https://cdn.jsdelivr.net/gh/jquery-i18n-properties/jquery-i18n-properties/jquery.i18n.properties.min.js"></script>引入后可以通过jQuery对象调用。我们先讲一下大概过程再来说调用方法：首先我们要有语言文件，...

github地址： pjax中文说明文档（非官方）： pjax基本参数$(document).pjax(selector, [container], options)selector为click选择器container为需要更新内容的容器选择器options为设置selector的一些技巧：我们可以给a元素添加一个属性：data-pjax来表示这是一个需要使用pjax的链接，这样就可以避免全部的a元素使用pjax了<a href="xxxx" data-pjax>$(document).pjax("a[data-pjax]", [con...

最近发现好多站点都开始做这个功能，每次复制都给我弹一次窗口，每次粘贴末尾总是带一大段版权文字，虽然不喜欢，但是没办法。比较这年头分享的知识ctrl+c和ctrl+v就是自己的了，加上超多机器人抓取，原创分享真的很难呢！效果图默认效果开启弹窗提示使用教程[hide]引入插件后，调用copyrightNotice方法： $("选择器").copyrightNotice();默认效果只会在复制的内容后面添加一句版权信息的提示文字。注意：您复制的为原创内容，转载请注明出处！谢谢！当然也是可以支持自定义的，支持传入一个对象，这个对象有三个参数。keyvalue说明copyri...

html5对多媒体优化很多，但是到现在我对于音乐和视频还是未知，所以这次就研究了下关于audio的用法。预览图功能[x] 播放&暂停[x] 上一曲&下一曲[x] 停止[x] 音量静音&音量条调整[x] 歌词[x] 播放进度条，可操控[x] 已播放时间&单曲总时长[x] 播放列表，支持双击播放，高亮提示[x] 三种播放模式，随机、列表循环、单曲循环注意由于火狐浏览器因为版权问题，并不支持mp3格式，所以我找到的办法就是从对火狐浏览器的设置进行调整，具体说明demo上贴了。demo[hide]音乐播放器[/hide]

图是我目前主题使用的样式，但是插件不带任何ui样式，他只有三个参数选项，通过传入的success函数进行天气数据对象的操作。更新2020-2-25新增高德ip定位，增加准确性！参数参数类型说明baidukeystring百度普通ip定位开发者keyamapkeystring高德天气开发者keysuccessfunction接受一个参数，该参数为返回的天气数据对象，具体可以查看高德天气说明我们先看下success接受的data是什么东西可以看到他就是一个键值对的对象，可以通过点方法调用到对应得值。调用方法 $.reachweather({ baidukey: '百度开发者key',...

$(document).ready(function () { /*禁用右键菜单 * 所有元素都有contextmenu事件，通过冒泡的方式可以触发到最外围的元素 * 直接给document元素设置该事件可以阻止右键菜单事件 * */ $(document).on('contextmenu', function () { return false; }); //给a元素设置新建窗口打开 $('a[href^="http"]').attr('target', '_blank'); ...

响应国家号召，在家里待着实在是没啥娱乐方式，就下了狂野飙车9玩，期间对它这个加载动画很喜欢，觉得能搞下来，就自己仿着样式写了个加载动画，这个动画以后将加入的我的自用主题效果，废话不多说，上图！更新2020-2-3优化的最后阶段动画展示方式修复快结束动画的时候，窗口发生变化导致的动画重载针对部分宽屏做了初始化原汁原味效果（默认显示固定方格位置的背景图）预览图教程设置颜色<div id="aligame" data-theme='{"backgroundColor":"#1b2a2f","borderColor&qu...

了解了一下jq的移动端框架，因为年代久远，让我怀念曾经的时代，是何其的辉煌。首先由于年代久远，jq的版本需要使用1.0.1版本，然后下载jquery.mobile - 1.4. 5.zip，里面会有很多文件，我们需要拿两个主要文件，还有图片就行，文件分别为：jquery.mobile-1.4.5.min.cssjquery.mobile-1.4.5.min.js一个css文件，一个js文件，然后引入顺序为，css，jq，jq.mobile使用方法：通过自定义的元素属性来配置，基本结构如下<div data-role="page"> <div ...

应群友要求写了一个横向轮播，嗯.....有些小问题，但是不影响使用，后续再优化吧！不过现在都是用别人现成的成品了，组件那些，自写轮播挺少的了！预览图demo由于毛子的服务器移动网进不去，等回广州了再传吧！

ios端他自己有一个双击空白区域会自己放大缩小视窗,我怀疑就是这个功能导致dblclick无法正常触发,于是只能通过单次cilick来判断了.当第二次click的触发时间小于400ms说明是双击,于是通过创建时间戳进行对比. let lastClickTime = 0; let clickTimer; $('#body').on("click", e => { let nowTime = new Date().getTime(); if (nowTime - lastClickTime < 400) { /*双击*/...

这里需要使用到jquery-ui的position效果，所以需要引入jq-ui的js文件。通过特定的class名来进行区分，然后js加上对应的效果。做这个主要是他这个ui挺简洁的，以后说不定用的到，反正不是很难，就花点时间做了个插件。预览图：使用教程html<a href="images/02.jpg" title="图片信息" class="thickImg"> <img src="images/look.gif" alt="查看大图"> &l...

找了好几个放大镜插件发现全是老旧的，新版jq取消了很多东西，所以导致以前的都无法使用了，索性就自己写了一个新的放大镜插件。预览图：使用教程html结构<a href="images/01.jpg" class="jqzoom" title=""> <img src="images/small_01.jpg" title="迷你图片"> </a>通过给a元素一个class为jqzoom的钩子，然后添加一个href属性...

自己尝试写了两个滑动验证的效果，不多说，上图：demo 地址滑动验证-拼图滑动验证-滑动

validate默认有几种验证方式，但是定死的方法肯定不能得到发展的，作为老牌的jq插件，他支持自定义验证方法。首先我们需要引入他自己的模块，additional-methods.js文件，也就是说在引入jquery.validate.js插件之后，还需要引入这个additional-methods.js文件。注：如果还需要使用中文的message信息提示，还需要在additional-methods.js后面再引入对应的语言，如：messages_zh.js，这个就是中文的提示信息。因为如果你自定义的一个验证方法，而messages_zh.js先引入了，你这这个文件里面写的对应方法的信...

依旧采用ajax配合阿里云api来获取快递信息，支持自动判断快递公司，初次对接，json部分筛选好做，就是整体的事件判断太麻烦了，快递100的网页还可以通过快递单号先做一个本地预判，这个主要他有大数据分析，有数据库支持，我这边没这个基础，不然也能做，他无非就是分析多少位，开头什么数字，结束什么数字，开头是什么字母，为此我尝试的为顺丰加了一个单独预判，就是单号开始输入sf，大小写都能识别为顺丰。瞬间被用完100次免费查询额度，我还没体验几次呢，无奈续费了下api不多说，上图：demo地址查看功能介绍[x] 采用html5+css3构建[x] 使用jq v3.4.1[x] 响应式结构支持32...

如果要在jq里进行跨域，一般来说只有使用jsonp，另一种方式则是进行中间层欺骗，也就是所谓的反代。这里我们主要讲讲json是怎么回事基本json实现jsonp全部都是使用带有src标签的元素，一般默认使用script元素，在src链接地址中，在地址后面加上?name=value&callbakc=hd；其中name=value是传值，而callbakc=hd则是回调，在本地js全局作用域下创建一个名为hd的函数。var script = document.createElement("script"); script.src = "xxxx?callbac...

以前写静态站点的时候一直想要一个图片的站点，但是又不想弄成个本地的，个人又懒得更新，这次ajax尝试使用api来获取别人分享的图片，为此就有了这个页面。提供了诸多筛选条件，分类，排序，图片px大小，比例，色系，后续有能力再加上搜索关键词，下一步就是加上图箱，我要想一个好一点的图箱办法，然后支持后续更新升级，长期使用，以前写的有点简陋。不多说，上图:功能详解：[x] 无刷新加载图片[x] 跨域[x] 丰富的筛选条件[x] 支持翻页，因为是ajax刷新，目前固定6页的页值，下一页可以无限，只要还有内容就可以一直下一页[x] 响应式结构[ ] 后续增加图箱[ ] 后续增加指定跳转到某一页Dem...

由于jq的cookie插件已经放弃维护了，其团队改为js-cookie在github上进行新的开源分享。地址为：https://github.com/js-cookie/js-cookie下载到引用的js文件后引用即可。调用方法：//设置 Cookies.set(name,value,{expires: time, path: '/'}); //其中value的值支持对象的形式传入 var box = { a = 1, b = 2 } Cookies.set(name,box,{expires: time, path: '/'}); //虽然支持传入，但是调用的时候需要进行j...

之前看过一个主题，忘记是谁的了，他的首页轮播特别好看，当时我还天真的以为他的轮播的背景色是自动获取的，为此还特意自己去看了下自动获取图片平均色，现在学了jq后尝试性仿写了一个，因为找不到原来主题的地址，所以大部分都是凭借自己的印象做的，有能力者可以自行移植到typecho主题上。先上图：响应式预览：功能特性：[x] 采用jquery 3.4.1[x] 图片预加载[x] 自动提取对应的内容[x] 增加自动轮播功能[x] 可以自行移植到主题上使用[x] 响应式功能完善，只是320分辨率及以上设备演示地址轮播图demo

下拉列表平时遇到的少，这里做个笔记先，主要功能就是从左边的select1中将选中的option元素移动到右边的select2中去，其实也很简单，主要是涉及到如何筛选选中的，然后使用到新的一个属性方法prop()。html：<div class="centent"> <select name="" id="select" multiple style="width: 100px;height:160px;"> <option value="1"...

普通切换效果html代码： <div class="box"> <ul> <li><a href="#">佳能<i>(30440)</i></a></li> <li><a href="#">索尼<i>(30440)</i></a></li> <li><a href="...