我有下面的代码动画 div (#feedback-form-container) 滑入和滑出,当点击它跳到屏幕的中心,然后这些幻灯片动画被关闭。一旦提交了 div 中的表单并且表单返回到原来的位置,我想再次打开这些动画,但这不起作用。我试图为此使用 on() ,但没有成功。有人能发现问题吗?我难住了。
/////////////////////feedback form animation//////////////////////
jQuery(document).ready(function($) {
//find center of screen
var $screenwidth = $(window).width();
var $screencenter = $screenwidth / 2 - 177;
var $startpos = $screencenter + 260;
var overlay = jQuery('<div id="simpleoverlay"> </div>');
//hover to slide functions
$('div#feedback-form-container').hover(function() {
$('div#feedback-form-container').animate({
left: '+=260px'
},
'2000');
},
function() {
$('div#feedback-form-container').animate({
left: '-=260px'
},
'6000');
});
//click to slide to center of screen
$('div#feedback-form-container').click(function() {
$('div#feedback-form-container').animate({
left: '+=' + $screencenter
},
{
duration: '2000',
easing: 'swing',
complete: setTimeout(function() {
overlay.appendTo(document.body)
},
500)
});
//unbind functions
if ($('div#feedback-form-container').is(':animated')) $('div#feedback-form-container').off('click').off('hover');
//set cursor back to default
$('div#feedback-form-container').css('cursor', 'default');
});
$('#wpcf7-f52-t1-o1').submit(function() {
$('div#feedback-form-container').animate({
left: '-=' + $startpos
},
'6000');
$('div#feedback-form-container').on('hover').on('click');
});