帶圖像預覽的下拉菜單列表

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)"); 
    }); 
}); 

並重復每個菜單項