MVC 4 Razor 图像鼠标悬停显示更大的图像答案

【问题标题】：MVC 4 Razor image mouse over show larger imageMVC 4 Razor 图像鼠标悬停显示更大的图像
【发布时间】：2013-11-16 03:27:07
【问题描述】：

有谁知道添加一些 JQuery 的方法，允许用户将鼠标悬停在 Razor 的 foreach 循环中动态创建的 UNKNOWN id 上？当图像悬停或悬停时，我需要获取 id 并执行 .show();对于那个图像。我让它在其他页面上使用一张图片，但无法弄清楚如何处理许多具有未知 ID 的图片。

这是包含两个图像的图像 div。完整图像显示在较小的图像之上，并在鼠标移出或没有悬停时消失。

<div class="listEntriesPhoto" style="display:inline-block; vertical-align:top;">
            <img id="EntriesDiagramLeft-@item.ImageName" src='~/documents/@item.ImageName' alt="repeating default photo of woman" />

            <!--This is for image hover for larger picture-->
            <div id="EntriesFullDiagramLeft-@item.ImageName" style="display:none;" >
                <img id="EntriesfullImageLeft-@item.ImageName" src='~/documents/@item.ImageName' alt="Submitted image"/>
            </div>
        </div>

任何帮助都会很棒，并在此先感谢！

【问题讨论】：

类“listEntriesPhoto”是您的根 div 元素吗？

标签： jquery image asp.net-mvc-4 razor

【解决方案1】：

这应该为你做：

  var photoList = $(".listEntryPhoto").find("img");
  .each(photoList, function(){
          var image = $(this);
          // Whatever code you used for one image goes here
          // using the image variable
    };

【讨论】：

嗨杰瑞德！我终于有时间回复了，因为我最初的截止日期很紧，然后就忘记了。无论如何，我把答案归功于你，因为我最终拼凑了你发布的内容和我已经拥有的内容，而且效果很好！这是代码：
这里是代码： $(".DiagramLeft").mouseenter(function () { $(this).next(".FullDiagramLeft").show('normal'); }); $(".FullDiagramLeft").mouseleave(function () { $(this).hide('normal'); });