如何编写 <ul> 图片库，其中悬停效果影响超过 1 个元素？ [关闭]答案

【问题标题】：How to program an <ul> image gallery, where the hover effect impacts more than 1 element? [closed]如何编写 <ul> 图片库，其中悬停效果影响超过 1 个元素？ [关闭]
【发布时间】：2016-10-11 14:49:42
【问题描述】：

我想编写一个图片库，如下所示： http://www.volkswagen.de/de.html 默认情况下，所有按钮的大小相同。

当用户将鼠标悬停在按钮上时，其大小会增加，同时，所有其他按钮（除了用户悬停在按钮的左右两侧的按钮之外）都会缩小。

我认为它是 CSS 和 Javascript 的混合体，但我不知道它是如何工作的，尤其是考虑到按钮如何根据悬停的内容左右移动。

有人可以帮帮我吗？

【问题讨论】：

代码就在他们的网站上。尝试从中学习。（检查元素）
我们不会在这里编写代码，请自己努力，如果无法按预期工作，请在此处发布问题，我们会尝试帮助您

标签： javascript html css hover image-gallery

【解决方案1】：

使用jQuery 你可以这样做：

$(document).on('hover', 'img', function() {

   // make all images small except this
   $('img').not(this).removeClass('big').addClass('small');

   // make this one large
   $(this).addClass('big');

});

但是你应该研究你给出的例子，像其他人建议的那样查看源代码

【讨论】：

非常感谢。我很抱歉没有先尝试就匆匆忙忙地做这件事。我正在开始一份新工作，我想尽快开始工作。我道歉。下次我会尝试采取不同的行动。