jQuery 使用附加效果 [英] jQuery using append with effects
问题描述
如何使用 .append()
和 show('slow')
对 append
产生影响似乎根本不起作用,它给出与正常 show()
相同的结果.没有过渡,没有动画.
如何将一个 div 附加到另一个 div 并对其产生 slideDown
或 show('slow')
效果?
对附加的效果不起作用,因为浏览器显示的内容会在附加 div 后立即更新.因此,结合 Mark B 和 Steerpike 的答案:
在实际附加之前将要附加的 div 设置为隐藏样式.您可以使用内联或外部 CSS 脚本来完成,也可以将 div 创建为
... </div>然后您可以将效果链接到您的 append(demo):
$('#new_div').appendTo('#original_div').show('slow');
或者(演示):
var $new = $('#new_div');$('#original_div').append($new);$new.show('慢');
How can I use .append()
with effects like show('slow')
Having effects on append
doesn't seem to work at all, and it give the same result as normal show()
. No transitions, no animations.
How can I append one div to another, and have a slideDown
or show('slow')
effect on it?
解决方案 Having effects on append won't work because the content the browser displays is updated as soon as the div is appended. So, to combine Mark B's and Steerpike's answers:
Style the div you're appending as hidden before you actually append it. You can do it with inline or external CSS script, or just create the div as
<div id="new_div" style="display: none;"> ... </div>
Then you can chain effects to your append (demo):
$('#new_div').appendTo('#original_div').show('slow');
Or (demo):
var $new = $('#new_div');
$('#original_div').append($new);
$new.show('slow');
这篇关于jQuery 使用附加效果的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文
相关文章
- jQuery 使用附加效果;
- 如何附加回调到jquery效果对话框显示?;
- 使用jQuery雷达扫描效果;
- 使用 Jquery 附加链接;
- 附加一个有淡入淡出效果的元素[jQuery];
- 褪色效果使用javascript没有jquery?;
- gwt使用jquery效果可能吗?;
- jQuery的使用效果与追加;
- 延迟JQuery效果;
- jQuery .slideRight效果;
- jQuery fadeIn效果;
- 如何使用jQuery附加HTML;
- 如何使用jQuery附加HTML?;
- 使用JQuery附加列表值;
- jQuery/Jquery工具效果变小;
- jQuery(附加);
- 如何在对话框显示中将回调附加到 jquery 效果?;
- 使用CSS / JS / jQuery折弯图像效果?;
- 如何使用jQuery / JavaScript实现轮播效果;
- 使用 jQuery 动态附加 textarea 元素;
- jQuery变形图像效果;
- jQuery“$(...)。效果不是函数”;
- jQuery超时效果;
- jQuery图片悬停效果;
- jQuery图像悬停效果;
其他开发最新文章
- 拒绝显示一个框架,因为它将'X-Frame-Options'设置为'sameorigin';
- 什么是&QUOT; AW&QUOT;在部分标志属性是什么意思?;
- 在运行npm install命令时获取'npm WARN弃用'警告;
- cmake无法找到openssl;
- 从Spark的scala中的* .tar.gz压缩文件中读取HDF5文件;
- Twitter :: Error :: Forbidden - 无法验证您的凭据;
- 我什么时候需要一个fb:app_id或者fb:admins?;
- 将.db文件导入R;
- npm通知创建一个lockfile作为package-lock.json。你应该提交这个文件;
- 拒绝执行内联脚本,因为它违反了以下内容安全策略指令:“script-src'self'”;