1.返回顶部
使用JQuery的animate和scrollTop方法可以创建简单地返回顶部的动画:

// Back to top
$('#top').click(function (e) {
e.preventDefault();
$('html,body').animate({scrollTop: }, );
});

2.图片预加载
如果页面使用了很多不是最初加载便可见的图片,有必要进行预加载:

$.preloadImages = function () {
for (var i = 0; i < arguments.length; i++) {
$('img').attr('src', arguments[i]);
}
};
$.preloadImages('img/hover-on.png', 'img/hover-off.png');

  判断图片是否完全加载

$('img').load(function () {
console.log('image load successful');
});

  自动修复损坏图片

$('img').on('error', function () {
$(this).prop('src', 'img/broken.png');
});

3.Hover状态的类切换

1)
$('.btn').hover(function () {
$(this).addClass('hover');
}, function () {
$(this).removeClass('hover');
});
2)
$('.btn').hover(function () {
$(this).toggleClass('hover');
});

4.Fade/Slide切换  实现第一次点击显示元素而第二次点击隐藏元素的效果

// Fade
$('.btn').click(function () {
$('.element').fadeToggle('slow');
});
// Toggle
$('.btn').click(function () {
$('.element').slideToggle('slow');
});

5.通过文本查找元素

var search = $('#search').val();
$('div:not(:contains("'+search+'"))').hide();

jQuery实现的简单小功能(实用)的更多相关文章

  1. php+jquery+ajax+json简单小例子

    直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...

  2. jQuery实现的简单分页功能的详细解析

    分页功能在项目开发中不可或缺,老司机操作起来就和呼吸一样简单,新手恐怕就会吃力一些. 今天我回顾了一下具体的操作步骤,决定详细的分析一下每一步的实现目的及原理. 我们会创建一个简单的json文件来模拟 ...

  3. jQuery关于复选框的基本小功能

    这里是我初步学习jquery后中巨做的一个关于复选框的小功能: 点击右边选项如果勾上,对应的左边三个小项全部选中,反之全不选, 左边只要有一个没选中,右边大项就取消选中,反之左边全部选中的话,左边大项 ...

  4. Laravel实用小功能

    Laravel实用小功能 1.控制访问次数 laravel5.2的新特性,通过中间件设置throttle根据IP控制访问次数 原理:通过回传三个响应头X-RateLimit-Limit,X-RateL ...

  5. jQuery学习之路(7)- 用原生JavaScript实现jQuery的某些简单功能

    ▓▓▓▓▓▓ 大致介绍 学习了妙味,用原生的JavaScript实现jQuery中的某些部分功能 定义自己的函数库lQuery ▓▓▓▓▓▓ $()选择器的实现 jQuery是面向对象的,所以自己编写 ...

  6. JQuery的一些简单功能

    JQuery js的缺点总结 1.入口函数只能有一个,如果出现多个,后面的会覆盖掉前面的 2.代码容错性差,容易出错,出错会导致后面的代码不执行 3.存在浏览器兼容性,比如innerText在火狐浏览 ...

  7. 插件介绍 :cropper是一款使用简单且功能强大的图片剪裁jQuery插件。

    简要教程 cropper是一款使用简单且功能强大的图片剪裁jQuery插件.该图片剪裁插件支持图片放大缩小,支持鼠标滚轮操作,支持图片旋转,支持触摸屏设备,支持canvas,并且支持跨浏览器使用. c ...

  8. python实现简单的循环购物车小功能

    python实现简单的循环购物车小功能 # -*- coding: utf-8 -*- __author__ = 'hujianli' shopping = [ ("iphone6s&quo ...

  9. [经验共享] MapGIS实用小功能图解——由excel文件导成MapGIS点文件

    项目小组的几个成员都是学地下水和环境的,对于GIS懂得不是很多,于是把一些我们经常用到的mapgis实用小功能做成帮助文档,方便大家使用,发布共享! 1.整理好EXCEL文件(注意X,Y坐标的正确性( ...

随机推荐

  1. jQuery包装集

    jQuery包装集指的是通过$()方法返回的一个元素集,这跟一般的javascript数组有所区别, 包装集在后者的基础上还有一些初始化的函数和属性. 我们可以对二者进行一个比较: jsdiv = d ...

  2. PhpStorm 8.x/9.x 快捷键设置/个性化设置,如何多项目共存?如何更换主题?

    1."自定义"常用快捷键(设置成跟Eclipse差不多) 按照路径:File -> Settings -> Appearance & Behavior -> ...

  3. iOS开发——高级篇——iOS中常见的设计模式(MVC/单例/委托/观察者)

    关于设计模式这个问题,在网上也找过一些资料,下面是我自己总结的,分享给大家 如果你刚接触设计模式,我们有好消息告诉你!首先,多亏了Cocoa的构建方式,你已经使用了许多的设计模式以及被鼓励的最佳实践. ...

  4. openstack网络(neutron)模式之GRE的基本原理

    neutron网络目的是为OpenStack云更灵活的划分网络,在多租户的环境下提供给每个租户独立的网络环境. neutron混合实施了第二层的VLAN和第三层的路由服务,它可为支持的网络提供防火墙, ...

  5. struts2 自定义校验规则

    自定义校验规则:(了解) 在Struts2自定义校验规则: 1.实现一个Validator 接口. 2.一般开发中继承ValidatorSupport 或者 FieldValidatorSupport ...

  6. tc674div1b

    题意:给出n个孩子的初始位置,和每个孩子开始的朝向(左或者右),然后孩子的行走规则是,速度始终为1,两人相遇则两人立即转身背向而行. 现在有q次询问,每次问编号为i的孩子在时间t距离原点的距离.返回所 ...

  7. linux 汇编

    nasm的语法和大学教材上8086的汇编伪指令有些差别,指令都是一样的. 编辑器就是普通的编辑器,vim,emacs,gedit,kate源文件类型为ascii码的plain text 编译用gcc或 ...

  8. ios推送-B/S架构-socket

    B/S架构项目,某一用户登录后执行了某些动作需要向在手机登录的对应的用户推送消息 通过socket实现 1.socket服务器:使用C#的window服务(该服务监听两个端口:比如平台8889,手机8 ...

  9. 使用 CUDA范例精解通用GPU编程 配套程序的方法

    用vs新建一个cuda的项目,然后将系统自动生成的那个.cu里头的内容,除了头文件引用外,全部替代成先有代码的内容. 然后程序就能跑了. 因为新建的是cuda的项目,所以所有的头文件和库的引用系统都会 ...

  10. mysql 分表

    1.分表,即把一个很大的表达数据分到几个表中,这样每个表数据都不多. 优点:提高并发量,减小锁的粒度 缺点:代码维护成本高,相关sql都需要改动 2.分区,所有的数据还在一个表中,但物理存储数据根据一 ...