VQuery高级特性

css方法

同时设置多个--for in

链式操作

链式操作

函数,链式操作

css 方法链式操作

json的使用

阻止冒泡,默认事件

VQuery插件

插件机制

可以扩展库的功能

extend

为VQuery添加方法

原型

实例

animate---动画

                else
{
iCur=parseInt(getStyle(obj, attr));
} //2.算速度
var iSpeed=(json[attr]-iCur)/8;
iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed); //3.检测停止
if(iCur!=json[attr])
{
bStop=false;
} if(attr=='opacity')
{
obj.style.filter='alpha(opacity:'+(iCur+iSpeed)+')';
obj.style.opacity=(iCur+iSpeed)/100;
}
else
{
obj.style[attr]=iCur+iSpeed+'px';
}
} if(bStop)
{
clearInterval(obj.timer); if(fn)
{
fn();
}
}
}, 30)
}
});

运动的的封装.js

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
#div1 {width:100px; height:100px; background:red; filter:alpha(opacity: 30); opacity:0.3;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.7.1.js"></script>
<script>
$(function (){
$('#div1').hover(function (){
$(this).animate({width: '200px', height: '200px', opacity: 1});
}, function (){
$(this).animate({width: '100px', height: '100px', opacity: 0.3});
});
});
</script>
</head> <body>

运动的实例

drag---拖拽

$().extend('drag', function (){
var i=0; for(i=0;i<this.elements.length;i++)
{
drag(this.elements[i]);
} function drag(oDiv)
{
oDiv.onmousedown=function (ev)
{
var oEvent=ev||event;
var disX=oEvent.clientX-oDiv.offsetLeft;
var disY=oEvent.clientY-oDiv.offsetTop; document.onmousemove=function (ev)
{
var oEvent=ev||event; oDiv.style.left=oEvent.clientX-disX+'px';
oDiv.style.top=oEvent.clientY-disY+'px';
}; document.onmouseup=function ()
{
document.onmousemove=null;
document.onmouseup=null;
};
};
}
});

vquery拖拽的封装

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
div {width:100px; height:100px; background:red; position:absolute;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="VQuery.js"></script>
<script src="VQuery_drag.js"></script>
<script>
$(function (){
$('div').drag();
});
</script>
</head> <body>

拖拽的应用

VQuery高级特性的更多相关文章

  1. ActiveMQ中的Destination高级特性(一)

    ---------------------------------------------------------------------------------------- Destination ...

  2. Python3学习(二)-递归函数、高级特性、切片

    ##import sys ##sys.setrecursionlimit(1000) ###关键字参数(**关键字参数名) ###与可变参数不同的是,关键字参数可以在调用函数时,传入带有参数名的参数, ...

  3. 云端卫士实战录 | Java高级特性之多线程

    <实战录>导语 一转眼作为一名Java开发者已经四年多时间了,说长不长说短不短,对于java的感情还是比较深的,主要嘛毕竟它给了我饭吃.哈哈,开个玩笑.今天我想借此机会来和大家聊聊Java ...

  4. javascript高级特性

    01_javascript相关内容02_函数_Arguments对象03_函数_变量的作用域04_函数_特殊函数05_闭包_作用域链&闭包06_闭包_循环中的闭包07_对象_定义普通对象08_ ...

  5. Visual Studio 2015 速递(4)——高级特性之移动开发

    系列文章 Visual Studio 2015速递(1)——C#6.0新特性怎么用 Visual Studio 2015速递(2)——提升效率和质量(VS2015核心竞争力) Visual Studi ...

  6. Android TextView高级特性使用

    TextView一般都是用来显示一段文本,这里说的高级特性主要是一些我们平常不太常用的属性.包括文字阴影.自定义字体.html嵌入多格式.字体加粗.插入图片.这些特性平时开发APP的时候,可能一般使用 ...

  7. Python的高级特性8:你真的了解类,对象,实例,方法吗

    Python的高级特性1-7系列是本人从Python2过渡3时写下的一些个人见解(不敢说一定对),接下来的系列主要会以类级为主. 类,对象,实例,方法是几个面向对象的几个基本概念,其实我觉得很多人并不 ...

  8. Python的高级特性7:闭包和装饰器

    本节跟第三节关系密切,最好放在一起来看:python的高级特性3:神奇的__call__与返回函数 一.闭包:闭包不好解释,只能先看下面这个例子: In [23]: def outer(part1): ...

  9. Spring框架学习[IoC容器高级特性]

    1.通过前面4篇文章对Spring IoC容器的源码分析,我们已经基本上了解了Spring IoC容器对Bean定义资源的定位.读入和解析过程,同时也清楚了当用户通过getBean方法向IoC容器获取 ...

随机推荐

  1. webkit的一些不为人知的高级属性

    1.-webkit-tap-highlight-color   tap按钮或者链接时,就会出现一个半透明的灰色背景,设置属性: -webkit-tap-highlight-color:transpar ...

  2. Outlook2003收到的邮件不能显示图片,但转发或回复可以 故障排错

    转自:http://wenku.baidu.com/link?url=4O0Wpsnk_OasA7B-M4KMJ4H-WnLicT4vfVOT7AvXhTjpn-p2gBTNsXR4W230r0gAE ...

  3. vim:用vim修改文件编码为utf-8

    命令是 :set fileencoding=utf-8如果用vim打开文件时里面有乱码,可能用上面的命令修改文件后无法保存.可以用其他软件打开文件,然后把内容拷贝到vim里再保存就行了.

  4. SCWS分词扩展在WINDOWS下的安装方法

    安装之前先确认您是否拥有主机的安装权限,否则无法进行安装,安装步骤如下: 1. 根据您当前用的 PHP 版本,下载相应已编译好的 php_scws.dll 扩展库. 目前支持以下版本   [PHP-4 ...

  5. Python之路【第三篇】:Python基础(二)

    函数的理解 面向过程:根据业务逻辑从上到下写垒代码 函数式:将某功能代码封装到函数中,日后便无需重复编写,仅调用函数即可 函数作用是你的程序有良好的扩展性.复用性. 同样的功能要是用3次以上的话就建议 ...

  6. YII2 实现后台操作记录日志(转)

    一.连接linux服务器,创建数据文件 php yii migrate/create user_log 二.修改数据文件 console/migrations/m150721_032220_admin ...

  7. android自定义控件(5)-实现ViewPager效果

    对于系统的ViewGroup我们已经是十分熟悉了,最常用的LinearLayout和RelativeLayout几乎是天天要打交道,下面我们就来看看,如何一步一步将其实现: 一.首先当然也是最通常的新 ...

  8. linux命令--nslookup

    nslookup和dig都是非常有用的网络命令,简单而言,就是查dns信息用的. 本地的dns配置文件在哪里? 文件是:/etc/resolv.conf 打开这个文件:vi /etc/resolv.c ...

  9. oracle 中的Ipad()函数

    本文基于转载: lpad函数从左边对字符串使用指定的字符进行填充.lpad意思是从左边填充的意思. 语法格式如下: lpad( string, padded_length, [ pad_string ...

  10. Linux运维初级教程(四)shell简介

    查看系统可用的shell命令 cat /etc/shells shell是用于与内核进行交流的工具 管道和重定向(< < > > |) |为管道 标准输入的文件描述符为0,标准 ...