首页 新闻 会员 周边

myFocus 插件如何控制图片显示大小?

0
[已解决问题] 解决于 2014-01-13 08:56

我遇到下面这样的问题:

在页面里面使用myFocus插件展示图片幻灯片,上传的图片太大了,myFocus.set()函数已经按照官网说明设置,但是部署网站后图片展示的还是太大,set函数设置如下:

(1)引入js插件

<script src="@Url.Content("~/Content/myfocus/js/myfocus-1.2.3.full.js")" type="text/javascript"></script>

(2)加一个div标签展示图片

<div id="boxID" style="visibility:visible">
<!--焦点图盒子-->
@* <div class="loading">
<span>请稍候...</span></div>*@
<!--载入画面(可删除)-->
<ul class="pic">
<!--内容列表-->
@foreach (var url in imageList)
{
<li><a href="@url" target="_blank">
<img src="@url" thumb="" alt="" text="" /></a></li>
}
</ul>
</div>

(3)调用set函数设置:

<script type="text/javascript">
$(function () {
myFocus.set({
id: 'boxID', //焦点图盒子ID
pattern: 'mF_fscreen_tb', //风格应用的名称
time: 3, //切换时间间隔(秒)
trigger: 'click', //触发切换模式:'click'(点击)/'mouseover'(悬停)
width: 550, //设置图片区域宽度(像素)
height: 400, //设置图片区域高度(像素)
path: '@Url.Content("~/Content/myfocus/js/pattern/")',
wrap: false,
autoZoom: true,
txtHeight: 'default'//文字层高度设置(像素),'default'为默认高度,0为隐藏
});

});
</script>

(4)部署网站后展示的效果如下:

正常情况下如下:

遇到类似问题解决的求帮助

问题补充:

主要原因还是图片太大(占空间大 2MB以上),这种办法除外:对上传的图片进行大小限制,或者进行重新处理,加载缩略图

yss小虾米的主页 yss小虾米 | 菜鸟二级 | 园豆:238
提问于:2013-12-25 21:06
< >
分享
最佳答案
0

重新生成图片吧!将生成的图片路径返回,显示就行了,可以配合swfupload一块使用,体验也好一些

奖励园豆:5
秋壶冰月 | 大侠五级 |园豆:5903 | 2013-12-25 22:13

恩恩,也只能这样了

yss小虾米 | 园豆:238 (菜鸟二级) | 2013-12-25 22:19

@yss小虾米: 恩,呵呵

秋壶冰月 | 园豆:5903 (大侠五级) | 2013-12-25 22:23
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册