您的位置:首页> 日志> 动易系统 正文

  最近项目里遇到了内容页需要调取多图字段的问题,找了一下标签库,发现已经有两个标签是处理多图字段。分别是“多图拆分-广告.config”和“多图片字段处理.config”,但仔细看了一下,发现都不太适用。

  “图片字段处理”这个标签纯粹就是把图片列出来,没太大作用;“多图拆分-广告”这个标签的输出结构比较符合,但这个是用JS来对字段字进行处理,这样就用不了系统的内置函数对图片进行裁剪,遇到宽高不规则的图片时会导致图片拉伸变型。于是强迫症又发作了,自己弄了个处理多图字段的标签,效果如下图,输出的结构跟咱们平时用的焦点图一样。

  参数很简单,就3个,分别是多图字段的值,和图片的宽高值;把获取到的多图字段值传给标签就可以了。

 

模板调用:

<div id="cpPicSlide" class="picBtnTop"> 
	{PE.Label id="多图片字段处理(焦点图)" dataSource="{PE.Field id="cone" fieldname="picUrls" /}" /} 
</div> 

<script type="text/javascript">  
(function($){ 
	
	jQuery(".picBtnTop").slide({titCell:".hd ul li",mainCell:".bd ul",effect:"top",autoPlay:false,vis:1}); 

	jQuery(".picBtnTop").slide({ titCell:".sHd",mainCell:".hd ul",prevCell:".sPrev",nextCell:".sNext",effect:"top",vis:4,scroll:4,autoPage:true,pnLoop:false}); 

})(jQuery); 
</script> 

标签下载:多图片字段处理(焦点图)