[英]How to use JQuery UI slide effect to seamlessly slide out one div and slide in another div?
I am using 我在用
$( "#viewPort" ).effect( "slide", hideoptions, 1000, callback )
to slide out the "viewPort" div, and in the callback() function I am sliding in the new div into the display by calling 滑出“viewPort”div,并在callback()函数中我通过调用将新div滑入显示
$( "#viewPort2" ).effect( "slide", showoptions, 1000 )
var hideoptions = { "direction" : "left", "mode" : "hide";
var showoptions = {"direction" : "right","mode" : "show"};
The problem is that it is not seamless transition: first the content slides out leaving behind a blank area then the new content slides in. 问题在于它不是无缝过渡:首先内容滑出而留下一个空白区域然后新内容滑入。
Is there a way to avoid the blank display? 有没有办法避免空白显示?
It's because you're calling the effect on #viewPort2 in the callback to the effect of #viewPort. 这是因为你在#viewPort效果的回调中调用#viewPort2的效果。 That means it will occur only once the effect on #viewPort has fully finished.
这意味着只有在#viewPort的效果完全结束后才会出现。 Try calling the effect on #viewPort2 right after the one on #viewPort, for example:
尝试在#viewPort上的#viewPort2之后调用效果,例如:
$( "#viewPort" ).effect( "slide", hideoptions, 1000); //notice, no callback
$( "#viewPort2" ).effect( "slide", showoptions, 1000);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.