View层代码如下:
<a rel="group" href="/Photo/Index/<%: item.PhotoID %>" title="<%: item.Describe %>"><img src="/Photo/ThumbImage/<%: item.PhotoID %>" alt="<%: item.Describe %>" /></a>
URL:/Photo/Index/1将返回数据库中id为1的图像数据。
前台客户端页面使用FancyBox来显示图片,但是出现了乱码,就是以文本形式显示的图像数据。
去官网查阅相关资料,发现可以使用type选项解决此问题。将type设置为image即可。
示例代码如下:
<script type="text/javascript">
$(document).ready(function () {
$("a[rel=group]").fancybox({
'transitionIn': 'none',
'transitionOut': 'none',
'titlePosition': 'over',
'type': 'image',
'titleFormat': function (title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' ' + title : '') + '</span>';
}
});
});
</script>
原创文章,转载请说明出处。翟士丹@曲阜师范大学 VolcanoSoft