我正在尝试绘制地图,并且我有一个村庄对象的列表。然后我计算出地图的视图窗口,然后循环检查每个坐标,以查看数据库中是否存在村庄。如果有,我画村庄。我真正想要的是在每个村庄上空悬停时能够有一个 jquery 悬停菜单。
目前我有它,所以当你将鼠标悬停在一个村庄上时,每个村庄的所有悬停菜单都会显示,因为它们当然都共享相同的图像 ID 和悬停菜单 ID。但是,如果我将它们更改为唯一的 ID,我怎样才能为每个村庄制作悬停框?
这是我目前的代码(我正在循环并写入文字控件)
地图.aspx.cs
MapLiteral.Text = "";
MapLiteral.Text += "<table cellpadding=\"0\" cellspacing=\"0\">";
for (int i = minx; i <= maxx; i++)
{
MapLiteral.Text += "<tr>";
for (int j = miny; j <= maxy; j++)
{
MapLiteral.Text += "<td width\"50px\" height=\"50px\" style=\"border: solid 1px #2d5c25;\">";
if (Objects.Village.VillageExists(i, j))
{
Objects.Village village = new Objects.Village();
village = Objects.Village.GetVillage(i, j);
MapLiteral.Text += "<div class=\"village\"><img src=\"/Images/Map/Village1.gif\" /></div>";
MapLiteral.Text += "<div class=\"villagehover\" id=\"villagehover\">test</div>";
}
else
{
MapLiteral.Text += "<img src=\"/Images/Map/Grass.gif\" />";
}
MapLiteral.Text += "</td>";
}
MapLiteral.Text += "</tr>";
}
MapLiteral.Text += "</table>";
地图.aspx
<script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".villagehover").hide()
$(".village").hover(
function () {
$('.villagehover').stop().fadeTo("slow", 0.33);
},
function () {
$('.villagehover').stop().fadeOut("slow");
}
);
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">
<center>
<h2>
Map (<asp:Label ID="XTitleLabel" runat="server" />,
<asp:Label ID="YTitleLabel" runat="server" />)
</h2>
<asp:Literal ID="MapLiteral" runat="server"></asp:Literal>
任何帮助将不胜感激!