循环浏览图像直到悬停，然后根据您悬停的链接设置活动图像

Question

所以我有一些与图片有关的链接。我现在可以让图像循环，但是当我将鼠标悬停在相关链接上时，我会使活动图像发生变化（香港专业教育学院使相关链接和图像具有相同的ID）。这是我目前的代码：

function homepageCycle(){
    var $active = $('#homepage-images .active');
    var $next = ($active.next().length > 0) ? $active.next() : $('#homepage-images img:first');
    $next.css('z-index',2);//move the next image up the pile
    $active.fadeOut(1500,function(){//fade out the top image
        $active.css('z-index',1).show().removeClass('active');//reset the z-index and unhide the image
        $next.css('z-index',3).addClass('active');//make the next image the top one
    });
}


$(document).ready(function(){
    setInterval(homepageCycle, 4000);
})