Question

我有这些变量：

var menuItem_place = 0;
var menuItem_position = 0;
var menuItem_limit = parseInt($('.slideshowImage').length) - 1;

它们是我所拥有的幻灯片的关键变量。我需要将css属性和一些动画元素关联到变量menuItem_place。

例如：

if(slideshowItem_place = 0){
  $(this).({'background-color':'black'}, 150);
}

我尝试了一堆if / else但它不起作用。完整背景 - FIDDLE。

Answer 1

不幸的是，无法将回调附加到变量。回调仅适用于以不可预测的方式发生的事情 - 通常是用户输入。使用变量，您始终可以跟踪代码使用它的位置。

您真正想要的是这些变量的常见位置 - 实际上是菜单项动画的位置。如果您查看click个事件的每个回调，您会发现他们每次都会调用menu_animateClick(); - 这可能是您要进行任何更改的地方。

第一行将所有菜单项重置为原始大小：

contents.animate({margin: 20, height: '64%', lineHeight: '63px'}, 300);

第二行放大所选菜单项：

$(contents.get(menuItem_place)).stop().animate({margin: 0, height: '100%', lineHeight: '99px'}, 100);

第三行显示菜单必须移动的像素数：

menuItem_position = 0 - (menuItem_place * 200);

最后一行实际上将菜单移动到所选菜单项：

$('#menuContainer').stop().animate({left: menuItem_position + 'px'}, 300);

在该功能中，它使用代码段$(contents.get(menuItem_place))获取当前菜单项的内容，只需contents即可检索所有菜单项的内容。要将所选菜单项设置为黑色，您可以尝试以下方法：

$(contents.get(menuItem_place)).stop().css('background-color', 'black').show(100);

虽然将它恢复到原来的颜色是你仍需要弄清楚的事情！