博客

以下是关于 jQuery UI bounce 效果的详细攻略：

jQuery UI bounce 效果

jQuery UI bounce 效果用于创建一个元素反弹的动画效果。该效果可以通过 jQuery UI 的 effect()调用。

语法

$( ".selector" ).effect( "bounce", options, duration, callback );

参数

• options：一个对象，表示效果的选项。可以包含以下属性：
• distance：一个整数，表示元素反弹的距离默认值为 20。
• times：一个整数，表示元素反弹的次数。默认值为 5。
• duration一个整数，表示画的持续时间，单位为毫秒。默认为 400 毫秒。
• callback：一个函数，表示动画完成后要执行的回调函数。

示例一：元素反弹次

$( "#myDiv" ).effect( "bounce", { times: 1 }, 500 );

这将使 id 为 myDiv 的元素反弹一次，持续时间为 500 毫秒。

示例二：元素反弹五次

$( "#myDiv" ).effect( "bounce", { times: 5, distance: 50 }, 1000, function() {
  console.log( "动画完成！" );
});

这将使 id 为 myDiv 的元素反弹五次，每次反弹距离为 50 像素，持续时间为 1000 毫秒，并在动画完成后输出一条消息到控制台。

总结：

jQuery UI bounce 效果用于创建一个元素反弹的动画效果。该效果可以通过 jQuery UI 的 effect() 方法调用。使用该效果可以为网站添加动态效果，提高用户体验。

以上是关于 jQuery UI bounce 效果的详细攻略，包括语法、参数和两个示例。