display image using lightbox using MVC

China☆狼群 提交于 2020-01-06 05:50:06

问题


I am trying to display an a larger image using the thumbnail using lightbox but its not working.

In my layout view:

<link rel="Stylesheet" href="@Url.Content("~/Content/css/lightbox.css")" media="screen" />
<script type="text/javascript" src="@Url.Content("~/Content/js/prototype.js")" />
<script type="text/javascript" src="@Url.Content("~/Content/js/scriptaculous.js?load=effects,builder")" />
<script type="text/javascript" src="@Url.Content("~/Content/js/lightbox.js")" />

Then in my view where the thumbnail is:

@{
Layout = "~/CustomViews/abc.net/Shared/_DealerLayout.cshtml";

}

<td>
            <a href="@Url.Content("~/Content/Custom/abc.net/Images/fylerlarge.jpg")" rel="lightbox">
                <img src="@Url.Content("~/Content/Custom/abc.net/Images/fylersmall.jpg")" alt="Flyer1" />
            </a>
        </td>

The images required for lightbox are in images folder under content directory.

In my lightbox.js file, this is how the images are set.

fileLoadingImage: '/images/loading.gif',
fileBottomNavCloseImage: '/images/closelabel.gif'

In my lightbox.css, this is how previous and next linkbuttons are set:

#prevLink:hover, #prevLink:visited:hover { background: url(/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/images/nextlabel.gif) right 15% no-repeat; }

When i click the thumbnail, the large image is not displayed in a lightbox.

来源:https://stackoverflow.com/questions/5808935/display-image-using-lightbox-using-mvc

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!