目标：只需单击一下即可为div设置动画，而不仅仅是在初始加载页面时。
问题：当我加载页面时，它的行为就像我想要的那样但是当我再次尝试单击该元素时它将无法工作 - 除非我单击该元素两次。有什么想法吗？
的jQuery
$(document).ready(function() {
$('h1.slide1').live('click', function() {
$("div#slidebox1").animate({
top: -129
}, 300);
$("div#slidebox2").animate({
top: 115
}, 300);
$("div#slidebox3").animate({
top: 115
}, 300);
$(this).removeClass("slide1").addClass("selected");
});
$("h1.selected").live('click', function() {
$("div#slidebox1").animate({
top: 115
}, 300);
$(this).removeClass("selected").addClass("slide1");
});
$('h1.slide2').live('click', function() {
$("div#slidebox2").animate({
top: -129
}, 300);
$("div#slidebox1").animate({
top: 115
}, 300);
$("div#slidebox3").animate({
top: 115
}, 300);
$(this).removeClass("slide2").addClass("selected2");
});
});
CSS
#slidebox h1{
font-size:12px;
height:30px;
color:#212121;
font-weight:bold;
z-index:11;
cursor:pointer;
}