【推荐】10个既绚又实用的JQuery特效教程

导读：作者Aamir Baig在designersdare.com分享了一篇文章《10 Must See jQuery Latest Tutorials-Beginners and Advance Level》，文中对初学者和资深学者分别提供了不同级别的教程，使用JQuery做出的既炫丽又实用的效果，现将本文摘译，以下是文章内容：

此篇文章是JQuery高级教程，但对初学者学习JQuery也有一定的帮助。

首先让我们先对初学者谈谈如何开始学习JQuery。对于初学者学习JQuery来说是一个很不错的简短教程。

初学者教程：

让我们开始为初学者讲解JQuery的初步知识。在本教程中，您将学到如何下载JQuery库、添加项目、开发简单的程序、加载页面警告消息弹出窗口。

第一步：下载JQuery库

首先点击链接http://code.jquery.com/jquery-1.4.2.min.js下载JQuery库，保存在本地文件中。

第二步：在网页中添加JQuery库

在页面中添加Query库代码，代码如下：

script type=”text/javascript” src=”jquery-1.4.2.min.js” script  

第三步：添加警告窗口JQuery代码

在页面中添加页面上加载警告窗口代码，代码如下：

$(document).ready(function() {}函数调用已经准备就绪。在这个函数中添加了JavaScript函数显示警告信息。这个是一个非常简单的例子，添加后在屏幕上提示信息“jQuery tutorial for beginners Example（JQuery初学者示例教程）”。

点击查看示例：http://designersdare.com/jquery-tutorial/jquery-tutorial.html

中级和高级用户使用的JQuery教程

1.JQuery随机背景滚动效果教程

 

使用JQuery做出的动画背景，这是一个简单但很实用的简短教程。点击查看示例

2.JQuery制作聚光灯教程

聚光灯效果随着鼠标的移动而突显图像。点击查看示例

3.JQuery下拉菜单效果教程

简单实用、易于定制的下拉菜单。点击查看示例

4.JQuery教程设计

在此处列出教程中有价值的标题：

如何寻找元素？

1.简单的幻灯片模板

2.简单的消失效果

3.过渡效果

4.可折叠标签

5.动画悬停效果

6.全部模块可点击

7.可折叠模板

8.类似WordPress的后台评论

9.图片画廊

10.不同样式的链接类型

5.如何添加图片放大镜效果

非常专业、有趣的教程，创建属于自己的放大图片效果。

6.跨浏览器blockquote使用CSS和JQuery

网页设计师们经常使用Blockqoutes在自己的作品中。本教程可以教您如何在页面上引用

7.处理大量元素的控件提示

有很多的JQuery控件提示工具，其中有一些是非常实用的，供大家参考。

8.JQuery创建分页系统

本教程提供如何为您的网站创建一个分页系统。点击查看示例

9.JQuery的AJAX标签

在网页上自由创建您自己想要的标签。使您的网页脚本更加快速、安全。

10.漂亮的滑动导航：CSS、JQuery教程

我将告诉您如何创建出滑动效果的菜单和导航，当您的鼠标移到导航区域，导航自动滑出，鼠标离开导航自动隐藏。点击查看示例

原文发布时间为：2011-06-22

本文来自云栖社区合作伙伴“Linux中国”

动力节点jQuery学习教程，jQuery入门看这一篇就够了 jQuery 是一个“写得更少，但做得更多”的轻量级 JavaScript 库。 jQuery 极大地简化了 JavaScript 编程，它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。
06-老马jQuery教程-jQuery高级 1.jQuery原型对象解密 jQuery里面的大部分API都是在jQuery的原型对象上定义的。jQuery源码中对原型对象做了简写的处理。也就是说：jQuery.fn === jQuery.prototype,参考jQuery源码：
04-老马jQuery教程-DOM节点操作及位置和大小 1. jQuery创建DOM标签 1.1 DOM动态创建标签的方法 DOM时代我们通过document的createElement方法动态创建标签。创建标签后，动态的给他添加属性。例如代码： // 动态创建标签 var domDiv = document.
01-老马jQuery教程-jQuery入口函数及选择器 这套jQuery教程是老马专门为寒门子弟而录制，希望大家看到后能转发给更多的寒门子弟。视频都是免费，请参考课程地址：https://chuanke.baidu.com/s5508922.html 1.什么是jQuery？ 1.1 jQuery介绍 jQuery是一个轻型、快速的、小巧的功能丰富的JavaScript类库。
03-老马jQuery教程-DOM操作(上） jQuery DOM操作 在没有jQuery之前，DOM的操作相对来说有点麻烦，尤其是DOM节点的搜索。目前我们已经学习了jQuery的选择器，接下带大家一块学习jQuery的DOM操作，jQuery对DOM操作的封装让我们前端开发工作非常简便、简洁、兼容性好。
riot.js教程【三】访问DOM元素、使用jquery、mount输入参数、riotjs标签的生命周期 前文回顾riot.js教程【二】组件撰写准则、预处理器、标签样式和装配方法；riot.js教程【一】简介； 访问DOM元素 你可以通过this.refs对象访问dom元素 而且还有大量的属性简写方式可以使用 比如：if= {.