zepto .css,zepto的常用方法与操作（二）

三 .DOM，样式操作

1.隐藏显示

show

恢复对象集合中每个元素默认的‘display’值、如果你用hide将元素隐藏，用该属性可以将其显示。相当于去掉了display:none'

hide

Hide elements in this collection by setting their display CSS property to none.

通过设置CSS的属性display 为 none 来京对象集合中的元素隐藏。

toggle

toggle([setting])

显示或隐藏匹配元素。如果setting为true,相当于show方法。如果setting为false。相当于hide方法。

2.Css属性修改

$('ul .aa').css('color','');

括号里面第一个是要给当前元素添加的样式，第二个是要给的value，当value为空的时候，会移除标签本身的样式，前提是ul下面类名为aa的子元素

本身是粉颜色，当我添加了css样式color,'' 样式移除。

四,辅助函数

//用is判断li的父元素是不是ul

if($('li').parent().is('ul')){}

五，zepto的核心功能

1. zepto 事件机制

//通过on绑定了一个点击事件

$('button').on('click',function(){

alert(1);

})

//通过off移除绑定的点击事件

$('button').off();

//one只绑定一次事件

$('button').one('mouseover',function(){

alert(1);

})

六,动画效果

animate() 执行定义的动画。

这个方法通过改变样式将原有的样式改变成新的样式。CSS属性值是逐渐改变的，这样就可以创建动画效果。

只有数字值可创建动画(比如 "margin:30px")。字符串值无法创建动画(比如 "background-color:red")。

语法 1

$(selector).animate(styles,speed,easing,callback)

styles 必须，定义产生动画的效果

speed 可选，定义动画的速度，默认为‘normal’ 值(毫秒,'slow','normal','fast')

easing 可选。规定在不同的动画点中设置动画速度的 easing 函数。内置的 easing 函数：swing，linear

callback 可选 animate函数执行完之后执行的函数。

语法 2

$(selector).animate(styles,options)

styles 必须，定义产生动画的效果

options 规定动画的额外选项，speed 设置动画速度，easing 规定使用的easing函数，callback回调函数 . . .

Zepto 与 jquery 的不同

DOM操作

1.Jquery 操作ul元素时，添加id不会生效

2.Zepto操作ul元素时，添加id会生效

Box-sizing计算

1.Zepto 由盒模型(box-sizing)决定

2.Jquery 会忽略盒模型，始终返回内容区域的宽/高(不包含padding,border)

offset

1.zepto返回top|left|width|height

2.JQuery返回width|height

zepto .css,zepto的常用方法与操作（二）相关推荐

zepto 添加css,zepto 的 css 方法 -- 待续
获取样式: getComputedStyle 什么是计算后的样式就是经过css样式组合和 js操作后的最后的结果设置样式有三种方法: div.style.backgroundColor = ...
HTML中设置鼠标悬停状态伪类,四大伪类,css鼠标样式设置,reset操作,静止对文本操作...
本文将要为您介绍的是四大伪类,css鼠标样式设置,reset操作,静止对文本操作,教程操作方法:07.31自我总结一.a标签的四大伪类 a:link{样式} 未访问时的状态(鼠标点击前显示的状态) ...
深度学习（6）TensorFlow基础操作二: 创建Tensor
深度学习(6)TensorFlow基础操作二: 创建Tensor 一. 创建方式 1. From Numpy,List 2. zeros,ones (1) tf.zeros() (2) tf.zero ...
GIS基础软件及操作(二)
原文 GIS基础软件及操作(二) 练习二.管理地理空间数据库 1.利用ArcCatalog 管理地理空间数据库 2.在ArcMap中编辑属性数据第1步启动 ArcCatalog 打开一个地理数据库 ...
php 读取mysql 二维数组_PHP操作二维数组模拟mysql函数
PHP操作二维数组模拟mysql函数 public function monimysqltest(){ $testarray=array( array('ss'=>'1','dd'=>' ...
PHP设置谷歌验证器（Google Authenticator）实现操作二步验证
使用说明:开启Google的登陆二步验证(即Google Authenticator服务)后用户登陆时需要输入额外由手机客户端生成的一次性密码.实现Google Authenticator功能需要服务 ...
少儿编程Scratch学习教程5--基本操作(二)动画例子
本篇介绍下动画相关例子 1.表情的转换首先创建一个精灵角色之后在外观选项中,选择"将造型切换为...",这样就可以在特定情况下就可以更换造型了添加一个事件,当按下" ...
45-网上商城数据库-商品分类数据操作(二)
45-网上商城数据库-商品分类数据操作(二) 项目描述在电子商务兴起的大环境下,建立利用互联网开拓销售渠道,帮助企业及时调整商品结构,协助经销商打开货源的信息门户成为解决信息流通不畅的有效方案,电子 ...
python图像数据是几维数据_Python图像处理库PIL的ImagePath模块被用于存储和操作二维向量数据...
ImagePath模块被用于存储和操作二维向量数据.Path对象会被传递到ImageDraw模块中. 一.ImagePath模块的函数 1. Path 定义:ImagePath.Path(coordi ...

zepto .css,zepto的常用方法与操作（二）

zepto .css,zepto的常用方法与操作（二）相关推荐

最新文章

热门文章