带图像预览的下拉菜单列表

Question

如何为下拉项目制作图像预览，如下面的链接。 https://www.jumeirah.com/en/hotels-resorts/dubai/burj-al-arab/?currency=AED&gclid=Cj0KEQiA25rFBRC8rfyX1vjeg7YBEiQAFIb3b_5nlK1PNwQxRSn6cEP2Y1mEwqHjzC4w5ruyEXBTTOIaAsVZ8P8HAQ&gclsrc=aw.ds&dclid=COPghJmzl9ICFa8i0wodPXkEew

如果将鼠标悬停在菜单中的“酒店和度假村”中，将出现下拉菜单。然后，如果您将鼠标悬停在任何项目上，我们可以看到预览图像。我怎么能做出这样的事情？下拉我可以做，但问题是与预览图像。提前致谢。

Answer 1

这是一个jQuery函数...所有你需要做的是一样的东西：

$(document).ready(function(){ 
    $("#menu_item").mouseenter(function(){ 
     $("#pic_box").css("background-image", "url(image.jpg)"); 
    }); 
    $("#menu_item").mouseleave(function(){ 
     $("#pic_box").css("background-image", "url(other-image.jpg)"); 
    }); 
}); 

并重复每个菜单项