jQuery循环动画与获取组件尺寸的方法_jquery
程序员文章站
2022-05-23 14:42:05
...
本文实例讲述了jQuery循环动画与获取组件尺寸的方法。分享给大家供大家参考。具体分析如下:
JQ动画
style="width: 100px; height: 100px; background-color: #000; position: absolute; top: 50px; color: #FFF; left:50px;">
一、前言
1、jQuery中的animate()方法允许您创建自定义的动画。
animate() 方法几乎可以操作所有 CSS 属性,不过当使用 animate() 时,必须使用Camel标记法书写所有的属性名,比如,必须使用paddingLeft而不是padding-left,使用marginRight而不是margin-right,等等。同时,色彩动画并不包含在核心 jQuery 库中。如果需要生成颜色动画,您需要从 jquery.com 下载 Color Animations 插件。
2、通过jQuery,很容易处理元素和浏览器窗口的尺寸。
jQuery提供如下属性获取元素和浏览器窗口的尺寸。
二、基本目标
如下图:
在网页中创建两个按钮,一个按钮能够使组件的尺寸在显示与隐藏状态中切换,一个按钮能够使循环动画在开始与停止状态中切换
单纯的JQ没有暂停与开始动画播放的功能,必须下载jQuery Pause插件完成。本例而仅仅通过JavaScript去控制循环动画,所以每次暂停仅能在其完成一次循环体才能够打断,并不能做到在随意位置暂停开始的功能。
三、制作过程
以下是网页所有代码,之后再一部分一部分地解释:
复制代码 代码如下:
style="width: 100px; height: 100px; background-color: #000; position: absolute; top: 50px; color: #FFF; left:50px;">
推荐阅读
-
jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法
-
JS与jQuery实现子窗口获取父窗口元素值的方法
-
jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法
-
jQuery实现获取table中鼠标click点击位置行号与列号的方法
-
JQuery获取html元素文本内容的text方法与html方法
-
jQuery循环动画与获取组件尺寸的方法_jquery
-
js与jquery获取父元素,删除子元素的两种不同方法_javascript技巧
-
js网页特效:jQuery循环动画与获取组件尺寸的方法教程
-
js与jquery获取父级元素,子级元素,兄弟元素的实现方法_javascript技巧
-
Js与Jq 获取页面元素值的方法和差异对比_jquery