如何根據顯示的結果更改div背景圖像？

我有一個應用程序，顯示場地列表作爲部分，每個場地屬於一個地區。場地可以根據他們所在的區域進行過濾。我希望屏幕沿着中心分割，在左側顯示場地局部，並在右側顯示「手繪」地圖。如何根據正在顯示的場地更改右側地圖div中顯示的圖像？如何根據顯示的結果更改div背景圖像？

我希望默認是一個縮小的地圖，顯示所有區域，但是當所有顯示的場地都有相同的area_id數字時，我希望地圖圖像更改爲放大該區域的詳細地圖。

所以有點像這樣：

如果正在顯示AREA_ID = 1，則顯示該區域的圖像的所有場所
或者如果AREA_ID = 2，則顯示該區域圖像
別的顯示這些其它縮小圖像

我最終希望每個場地在地圖div中放置絕對定位的地圖上都有自己的圖標。

我有大約2個月的編程經驗，也許認爲這需要在JavaScript或jQuery（我一無所知）完成，但不知道，任何幫助，非常感謝！

來源

2011-02-10 Dave

我管理這與在場地部分html.erb文件此位的jQuery：

<script type="text/javascript"> 
    document.getElementById("venue_map_icon_<%= venue.id %>").style.left= "<%= venue.iconleftpx %>px"; 
    document.getElementById("venue_map_icon_<%= venue.id %>").style.top= "<%= venue.icontoppx %>px"; 
</script>

我加入iconleftpx：整數和icontoppx：整數字段到會場表中填充jQuery代碼調用的絕對定位的頂部和左側值。

來源

2011-03-09 23:43:12 Dave

使用區域代碼作爲您的元素的類，並在CSS中爲每個類設置背景圖像。

<div class="area_id_1"></div>

CSS：

.area_id_1 { 
    background-image:url(...) 
}

來源

2011-02-10 19:13:37

感謝您的快速響應，雖然我有點困惑，但您的意思是所有的部分是元素？ – Dave 2011-02-10 22:23:40

如何根據顯示的結果更改div背景圖像？

回答

相關問題