jquery缓动swing liner控制动画过程不同时刻的速度

jQuery效果函数(slideUp()、fadeIn()等)和animation()函数都接收另一个用来控制动画过程的速度的参数，这就是缓动(easing)，它确定了动画过程不同时刻的速度。例如，将一个元素移过页面的时候，可能让这个元素缓慢地开始移动，然后变得很快，最后随着动画的完成再次慢下来。给动画添加缓动，使得动画在视觉上更有趣且更有动态感。

jQuery只包含了两个缓动方法：swing和linear。linear方法提供了一个稳定的动画，以使得动画的每个步骤都是相同的(例如，如果要让一个元素以逐渐变化的方式穿过屏幕，每一步的距离和前一步都是相同的)。swing要更加动态一些，随着动画的开始变得更加快一些，然后再慢下来。swing是一个常用设置，因此，如果没有指定任何缓动，jQuery会使用swing方法。

对于任何jQuery效果来说，缓动方法是其第二个参数，因此，要使用linear方法将一个元素滑出视线，可以这样编写代码：


代码如下:

$('#element'). slideUp(1000，'linear')；

当使用animate()函数的时候，缓动方法是第三个参数，第一个参数是一个对象直接量，包含了我们想要实现动画的CSS属性；第二个参数是动画的整体速度。例如，要对动画代码使用linear缓动方法，可以像下面这样编写代码：


代码如下:

$('#message').animate(
{
left：'650px'，
opacity：.5，
fontSize：'24px'
}，
1500，
'linear'
)；

然而，并不仅限于使用jQuery所提供的两个缓动方法。使用jQuery插件可以添加一系列的其他的缓动方法。

赞 (0)

相关推荐

  • Java Swing中的工具栏(JToolBar)和分割面版(JSplitPane)组件使用案例

    Java Swing中的工具栏(JToolBar)和分割面版(JSplitPane)组件使用案例

    一:工具栏(JToolBar) 代码示例: 复制代码 代码如下: import javax.swing.*; //工具栏的使用案例 public class JToolBarDemo2_jigloo extends javax.swing.JFrame { private JToolBar myJToolBar;  private JButton jB_file;  private JButton jB_edit;  private JButton jB_tools;  private JBut

  • java Swing实现选项卡功能（JTabbedPane）实例代码

     Swing实现选项卡功能(JTabbedPane) 先创建JTabbedPane对象,构造函数可使用JTabbedPane(int tabPlacement).tabPlacement是JTabbedPane从接口 javax.swing.SwingConstants 继承的字段.可以是BUTTOM,TOP等.如下代码所示: JFrame jframe = new JFrame("TEST"); <a href="http://lib.csdn.net/base/do

  • Java Swing中的JButton、JComboBox、JList和JColorChooser组件使用案例

    Java Swing中的JButton、JComboBox、JList和JColorChooser组件使用案例

    Swing 的组件与AWT 组件相似,但又为每一个组件增添了新的方法,并提供了更多的高级组件. Swing 的基本组件: 1.按钮(JButton): Swing 中的按钮可以显示图像,并且可以将按钮设置为窗口的默认图标,而且还可以将多个图像指定给一个按钮. (1).JButton 常用的构造方法. JButton(String text):按钮上显示字符. JButton(Icon icon) :按钮上显示图标. JButton(String text, Icon icon):按钮上既显示图标

  • java swing中实现拖拽功能示例

    java swing中实现拖拽功能示例

    java实现拖拽示例 Swing中实现拖拽功能,代码很简单,都有注释,自己看,运行效果如下图: 复制代码 代码如下: package com; import java.awt.*;import java.awt.datatransfer.DataFlavor;import java.awt.dnd.DnDConstants;import java.awt.dnd.DropTarget;import java.awt.dnd.DropTargetAdapter;import java.awt.dn

  • Java Swing中的文本框(JTextField)与文本区(JTextArea)使用实例

    Java Swing中的文本框(JTextField)与文本区(JTextArea)使用实例

    一:JTextField的(文本框)使用: JTextField 是一个轻量级组件,它允许编辑单行文本. 1.JTextField的常用构造方法: JTextField() 构造一个新的 TextField. JTextField(int columns) 构造一个具有指定列数的新的空 TextField. JTextField(String text) 构造一个用指定文本初始化的新TextField. JTextField(String text, int columns) 构造一个用指定文本

  • Java Swing中的下拉式菜单(menu)、弹出式菜单(JPopupMenu)、选项卡窗体(JTabbedPane)组件使用案例

    Java Swing中的下拉式菜单(menu)、弹出式菜单(JPopupMenu)、选项卡窗体(JTabbedPane)组件使用案例

    菜单是GUI中最常用的组件,菜单不是Component类的子类,不能放置在普通容器中,不受布局管理器的约束,只能放置在菜单栏中. 菜单组件由菜单栏 (MenuBar).菜单(Menu)和菜单项(MenuItem)三部分组成. 一个菜单栏由若干个菜单组成,一个菜单又由若干个菜单项组成.一般菜单栏放 Frame 窗口中,只要调用 Frame 类的 setMenuBar()方法即可. 常用的菜单有:下拉式菜单和弹出式菜单(独立显示,可出现在任意地方). 一:下拉式菜单的创建步骤: 1.创建一个菜单栏.

  • 使用java swing实现qq登录界面示例分享

    用Java Swing做的一个QQ登录界面 复制代码 代码如下: import java.awt.Container;import java.awt.Image;import java.awt.event.ActionEvent;import java.awt.event.ActionListener; import javax.swing.ImageIcon;import javax.swing.JButton;import javax.swing.JCheckBox;import javax

  • Java Swing中的表格(JTable)和树(JTree)组件使用实例

    Java Swing中的表格(JTable)和树(JTree)组件使用实例

    一:表格(JTable): 1.基本概念: 表格(JTable)是Swing 新增加的组件,主要是为了将数据以表格的形式显示.给显示大块数据提供了简单的机制. 2.常用构造方法: * JTable():使用系统默认的模型创建一个JTable 实例.  * JTable(int numRows,int numColumns):创建一个使用DefaultTableModel 指定行.列的空表格.  * JTable(Object[ ][ ] rowData,Object[ ][ ] columnNa

  • java swing标准对话框具体实现

    java swing标准对话框具体实现

    复制代码 代码如下: package test001;import java.awt.event.ActionEvent;import java.awt.event.ActionListener;import javax.swing.JButton;import javax.swing.JFrame;import javax.swing.JOptionPane;import javax.swing.JToolBar;public class TestJOptionPane implements

  • 可视化Swing中JTable控件绑定SQL数据源的两种方法深入解析

    可视化Swing中JTable控件绑定SQL数据源的两种方法深入解析

    在 MyEclipse 的可视化 Swing 中,有 JTable 控件.JTable 用来显示和编辑常规二维单元表.那么,如何将 数据库SQL中的数据绑定至JTable中呢?在这里,提供两种方法.JTable的构造方法通过查阅Java的API,可以可以得到JTable的两个重要的构造方法:JTable(Object[][] rowData, Object[] columnNames)构造一个 JTable 来显示二维数组 rowData 中的值,其列名称为 columnNames.JTable

随机推荐