
JQuery
Vivian_shuang
Be a IT engineer!
展开
-
大图滚动
DOCTYPE html>html>head>metacharset="UTF-8">title>JQuery版title>styletype="text/css">*{margin:0;padding:0;}#wrap{width:700px;height:500px;overflow:hidde原创 2016-08-08 08:25:44 · 312 阅读 · 4 评论 -
closest2
DOCTYPE html>html>head>script type="text/javascript"src="js/jquery-1.12.3.js">script>head>body>ul id="one"class="level-1"> li class="item-i">Ili> li id="ii"class="item-ii">II原创 2016-07-22 15:18:29 · 297 阅读 · 0 评论 -
closest
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">li{margin:3px;padding:3px;background-color: pink;}li.hilight{background-color: palegreen;}原创 2016-07-22 15:17:54 · 393 阅读 · 0 评论 -
JQuery知识点
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>scripttype="text/javascript">1,animate 动画队列,animate 链式写法(相对好点),回调函数 连续动作动画,举例子:$("p").slideDown(100).slideUp(200).h原创 2016-07-22 15:16:50 · 207 阅读 · 0 评论 -
删除节点
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">style>scriptsrc="js/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scriptty原创 2016-07-22 15:16:18 · 322 阅读 · 0 评论 -
尺寸
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:100px;height:100px;background-color: deepskyblue;border:10px solid yellow;paddin原创 2016-07-22 15:15:53 · 262 阅读 · 0 评论 -
插入节点
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">.active{width:100px;height:100px;background-color: gold;}style>scriptsrc="js/jquery-2.1.3.原创 2016-07-22 15:15:23 · 319 阅读 · 0 评论 -
offsetTop与offset().top
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">.wrap{width:200px;height:200px;border:1px solid deepskyblue;background-color: blanchedalmond;原创 2016-07-22 15:13:57 · 598 阅读 · 0 评论 -
JQuery DOM
DOCTYPE html>html>head>metacharset="UTF-8">title>title>scriptsrc="js/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scripttype="text/javascript">$(document).原创 2016-07-22 15:13:24 · 245 阅读 · 0 评论 -
each方法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>scriptsrc="js/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scripttype="text/javascript">// each()方法原创 2016-07-22 15:19:09 · 490 阅读 · 0 评论 -
自定义插件
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">style>scriptsrc="js/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scri原创 2016-07-22 15:20:05 · 284 阅读 · 0 评论 -
图片切换
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">.wrap{position:relative;width:500px;height:284px;overflow:hidden;}#middle{ov原创 2016-07-22 15:34:53 · 336 阅读 · 0 评论 -
JQuery小练习
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div0{width:100px;height:100px;border:5px solid palegreen;}#div1{width:100px;height:原创 2016-07-22 15:33:46 · 475 阅读 · 0 评论 -
find方法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>style>.wrap{background:#CCCCCC;border:dashed #1010101px;}style>scriptsrc="js/jquery-2.1.3.min.js"type="text/jav原创 2016-07-22 15:23:14 · 426 阅读 · 0 评论 -
get方法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>scriptsrc="js/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scripttype="text/javascript">// 俗称扒皮方法,得到原创 2016-07-22 15:22:51 · 331 阅读 · 0 评论 -
parent
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">.wrap{background-color: red;border:1px solid black;}style>scriptsrc="js/jquery-2.1.3.min.js"原创 2016-07-22 15:22:29 · 367 阅读 · 0 评论 -
JQuery版tab切换
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">*{margin:0;padding:0;}#wrap{width:700px;height:500px;overflow:hidden;position:re原创 2016-07-22 15:22:04 · 552 阅读 · 0 评论 -
遍历
DOCTYPE html>html>head>metacharset="UTF-8">title>title>style>.wrap{background:#CCCCCC;border:dashed #1010101px;}style>head>body>divclass="wrap">span>111span>原创 2016-07-22 15:21:05 · 225 阅读 · 0 评论 -
回到顶端
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">body{height:9999px; }#div1{width:30px;height:30px;background-color:#CCCCCC;font-size:原创 2016-07-22 15:20:38 · 253 阅读 · 0 评论 -
replaceAll
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">p{color: aquamarine;}style>scriptsrc="js/jquery-2.1.3.min.js"type="text/javascript" charset="u原创 2016-07-22 15:12:35 · 308 阅读 · 0 评论 -
css类
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:100px;height:100px;background-color:#CCCCCC;}.active{border:10px solid yellow;原创 2016-07-22 15:11:34 · 227 阅读 · 0 评论 -
JQueryclone()方法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:100px;height:100px;background-color: chartreuse;}style>scriptsrc="js/jquery-2.原创 2016-07-22 15:11:02 · 290 阅读 · 0 评论 -
slide
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:100px;height:100px;background-color: blueviolet;border:1px solid bisque;margin-top原创 2016-07-22 15:02:04 · 320 阅读 · 0 评论 -
one方法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scripttype="text/javascript">$(documen原创 2016-07-22 15:01:24 · 443 阅读 · 0 评论 -
noConflict方法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scripttype="text/javascript">// jQuery原创 2016-07-22 15:00:47 · 594 阅读 · 0 评论 -
JQuery效果
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:100px;height:100px;background-color: springgreen;margin-top:20px;}style>原创 2016-07-22 14:58:10 · 163 阅读 · 0 评论 -
JQuery简介
DOCTYPE html>html>head>metacharset="utf-8" />title>title>styletype="text/css">#div1{width:100px;height:100px;background-color: greenyellow;}style>scriptsrc="js/jq/j原创 2016-07-22 14:59:17 · 237 阅读 · 0 评论 -
JQuery选择器
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#p1{color: red;}#p2{color: aquamarine;}#p3{color: chartreuse;}style>scriptsrc="js/jq/j原创 2016-07-22 14:58:43 · 189 阅读 · 0 评论 -
JQuery css方法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:100px;height:100px;background-color: pink;}style>scriptsrc="js/jq/jquery原创 2016-07-22 14:57:06 · 238 阅读 · 0 评论 -
fade
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:100px;height:100px;background-color: aquamarine;}style>scriptsrc="js/jq/jquery原创 2016-07-22 14:55:28 · 424 阅读 · 0 评论 -
window.onload与$(document).ready()区别
DOCTYPE html>html>head>metacharset="UTF-8">title>title>scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scripttype="text/javascript">/*1.执行时间原创 2016-07-22 15:02:40 · 236 阅读 · 0 评论 -
层次选择器
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">style>scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>script原创 2016-07-22 15:03:39 · 331 阅读 · 0 评论 -
基本过滤选择器
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">style>scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>s原创 2016-07-22 15:09:55 · 276 阅读 · 0 评论 -
内容过滤选择器
DOCTYPE html>html>head>metacharset="UTF-8">title>title>scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scripttype="text/javascript">$(doc原创 2016-07-22 15:09:18 · 302 阅读 · 0 评论 -
JQuery事件绑定
DOCTYPE html>html>head>metacharset="UTF-8">title>title>scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>scripttype="text/javascript">$(documen原创 2016-07-22 15:08:37 · 233 阅读 · 0 评论 -
子元素过滤器
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">style>scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript" charset="utf-8">script>s原创 2016-07-22 15:07:50 · 297 阅读 · 0 评论 -
动画队列3
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:20%;height:100px;font-size:14px;border:1px solid pink;background-color: paletu原创 2016-07-22 15:06:58 · 192 阅读 · 0 评论 -
动画队列2
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:80px;height:80px;background-color: plum;border:1px solid orange;}.div1{positio原创 2016-07-22 15:06:21 · 341 阅读 · 0 评论 -
动画队列
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">.show{width:100px;height:100px;background-color: aquamarine;border:1px solid orange;margin-b原创 2016-07-22 15:05:45 · 309 阅读 · 0 评论 -
动画1
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:100px;height:100px;background-color: pink;}style>scriptsrc="js/jq/jquery-2.1原创 2016-07-22 15:04:30 · 260 阅读 · 0 评论