我有这样的代码来显示/隐藏弹出窗口和div
function ToggleSendForm() {
var effect = 'slide';
var options = { direction: 'right', easing: 'swing' };
var duration = 1000;
$(".popup").toggle(effect, options, duration);
var effectFade = 'fade';
var durationFade = 1000;
$(".toggler").toggle(effectFade, durationFade);
};
function UnToggleSendForm() {
var effect = 'slide';
var options = { direction: 'right', easing: 'swing' };
var duration = 1000;
$(".popup").toggle(effect, options, duration);
var effectFade = 'fade';
var durationFade = 1000;
$(".toggler").toggle(effectFade, durationFade);
};
<div class="toggler" style="display: none"></div>
<div class="popup" style="background-color: #ffffff; display: none">
<div class="container" style="padding: 20px">
因此弹出窗口从右侧滑动。
我的问题是幻灯片弹出窗口是透明的。展开后变成白色。但是当它滑动时我也需要它是白色的。我错过了什么?
最佳答案
{ queue: false };
这是由 jQuery 中的动画队列引起的。 在切换选项中将队列设置为 false。
function ToggleSendForm() {
var effect = 'slide';
var options = { direction: 'right', easing: 'swing' };
var duration = 1000;
$(".popup").toggle(effect, options, duration);
var effectFade = 'fade';
var durationFade = 1000;
$(".toggler").toggle(effectFade, { queue: false }, durationFade);
};
function UnToggleSendForm() {
var effect = 'slide';
var options = { direction: 'right', easing: 'swing' };
var duration = 1000;
$(".popup").toggle(effect, options, duration);
var effectFade = 'fade';
var durationFade = 1000;
$(".toggler").toggle(effectFade, { queue: false }, durationFade);
};
jQuery API 文档:
queue (default: true) Type: Boolean or String A Boolean indicating whether to place the animation in the effects queue. If false, the animation will begin immediately. As of jQuery 1.7, the queue option can also accept a string, in which case the animation is added to the queue represented by that string. When a custom queue name is used the animation does not automatically start; you must call .dequeue("queuename") to start it.
关于javascript - jQuery 切换背景图片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21412515/