【读书笔记】【jQuery基础教程】【第四章--效果】
来源:互联网 发布:老师体罚孩子 知乎 编辑:程序博客网 时间:2024/06/06 09:24
1.使用.css()方法可以改变CSS样式,如:
.css('color','red')
.css({'color':'green','width':'600'})
2.使用.addClass()方法可以动态添加CSS样式,用.removeClass()方法可以动态删除CSS样式
3.利用.css()方法可以取得样式
4.使用.css()改变字体大小函数
5.使用.hide()方法隐藏元素,使用.show()方法显示元素,并且可以带参数,参数为速度
.hide()可以使用类似.css('display','none')
6.使用.fadeIn('slow')方法可以使元素按照速度淡入
使用.fadeOut('slow')方法可以使元素按照速度淡出
7.使用.toggle()方法可以实现.show()和.hide(),并且可以添加速度参数
另一个.slideToggle()方法可以通过逐渐增加或减少元素高度来显示或隐藏元素,可以添加速度参数
8.使用.animate()方法可以指定动画效果,简单例子:
9.使用$('#select-plays').animate({'font-size':'+=5px'},'slow');
+=可以在原基础上改变
10.使用.fadeTo('slow',0.5)可以变为以1为基准的透明
11.使用.slideUp('slow')可以隐藏,使用.slideDown('slow')可以显示
12.使用.queue()方法可以把函数添加到相应元素的效果队列中
具体使用方式如:
如果不适用.dequeue()方法, 会使动画中断
13.jQuery 为每个效果函数都添加了一个回调函数,在效果方法中,他们是方法的最后一个参数
回调函数将在效果结束之后调用,也可以通过.queue()来添加函数
.css('color','red')
.css({'color':'green','width':'600'})
2.使用.addClass()方法可以动态添加CSS样式,用.removeClass()方法可以动态删除CSS样式
$('#select-plays > li:odd').addClass('red'); $('#select-plays > li:odd').removeClass('red');
3.利用.css()方法可以取得样式
var fontSize = $('#select-plays').css('font-size');
4.使用.css()改变字体大小函数
$('#changeFontSize').click(function() {var fontSize = parseFloat($('#select-plays').css('font-size'),10);fontSize *= 1.4;$('#select-plays').css('font-size',fontSize + 'px'); });
5.使用.hide()方法隐藏元素,使用.show()方法显示元素,并且可以带参数,参数为速度
.hide()可以使用类似.css('display','none')
6.使用.fadeIn('slow')方法可以使元素按照速度淡入
使用.fadeOut('slow')方法可以使元素按照速度淡出
7.使用.toggle()方法可以实现.show()和.hide(),并且可以添加速度参数
另一个.slideToggle()方法可以通过逐渐增加或减少元素高度来显示或隐藏元素,可以添加速度参数
8.使用.animate()方法可以指定动画效果,简单例子:
$('#select-plays').animate({'font-size':'20px'},'slow');
9.使用$('#select-plays').animate({'font-size':'+=5px'},'slow');
+=可以在原基础上改变
10.使用.fadeTo('slow',0.5)可以变为以1为基准的透明
11.使用.slideUp('slow')可以隐藏,使用.slideDown('slow')可以显示
12.使用.queue()方法可以把函数添加到相应元素的效果队列中
具体使用方式如:
$('#select-plays').slideUp('slow').queue(function(){$('#select-plays').css('font-size','+=5px').dequeue();}).slideDown('slow');
如果不适用.dequeue()方法, 会使动画中断
13.jQuery 为每个效果函数都添加了一个回调函数,在效果方法中,他们是方法的最后一个参数
回调函数将在效果结束之后调用,也可以通过.queue()来添加函数
- 【读书笔记】【jQuery基础教程】【第四章--效果】
- jQuery基础教程第四章学习
- 【读书笔记】【jQuery基础教程】【第二章--选择符】
- 【读书笔记】【jQuery基础教程】【第三章--事件】
- 【读书笔记】【jQuery基础教程】【第五章--DOM操作】
- 【读书笔记】【jQuery基础教程】【第六章--AJAX】
- 《JQuery基础教程》第四版课后练习代码--第四章
- 廖雪峰《python3 基础教程》读书笔记——第四章
- jQuery基础教程(第四版)
- 学习笔记:《jQuery基础教程》第四版第二章课后练习
- 学习笔记:《jQuery基础教程》第四版第三章课后练习
- 《JQuery基础教程》第四版课后练习代码--第三章
- 《JQuery基础教程》第四版课后练习代码--第五章
- 《JQuery基础教程》第四版课后练习代码--第六章
- jQuery基础教程第四版 第3章学习笔记
- 学习笔记:《jQuery基础教程》第四版第四章课后练习——样式与动画
- 《锋利的JQuery》读书笔记——第四章
- 《锋利的jQuery》读书笔记第四章(事件和动画)
- Error "Lock NOT set for: Deleting transaction data selectively"
- Win7 系统美化知识
- 完美解决Android在listview添加checkbox实现单选多选操作问题
- 【读书笔记】【jQuery基础教程】【第二章--选择符】
- 【读书笔记】【jQuery基础教程】【第三章--事件】
- 【读书笔记】【jQuery基础教程】【第四章--效果】
- error C4430: 缺少类型说明符 - 假定为 int。注意: C++ 不支持默认 int
- 【读书笔记】【jQuery基础教程】【第五章--DOM操作】
- 【读书笔记】【jQuery基础教程】【第六章--AJAX】
- Nsight Visual Studio Edition 3.0 Release Candidate 1
- 微软认证考试70-461 Work with Data 数据处理 --27%比重--(3)
- 开源光栅化渲染器SALVIA的漫长五年
- 新的开始
- 面试笔记4