代码如下:
function getTopPic(preview){
$.ajax({
url: "topPic.action",
type: "post",
data: {partId:'24',preview : preview},
dataType :"json",
cache : false,
ansyc : false,
success : function(msg) {
var articles=msg.articleList;
imageip = msg.imageip;
var topSmallPic="";
var picUrlTemp = articles[0].VC2THUMBPICURL;
var urlBig = picUrlTemp.replace('.jpg','_630_349.jpg');
$("#focus_big").html(
'<a href="#"><img id="bigImage" src='+imageip+'/images/resources'+urlBig
+' /></a><div class="filterbg"></div><p class=""></p>');
for ( var i = 0; i < articles.length; i++) {
var picUrl = articles[i].VC2THUMBPICURL;
var smallimgid = articles[i].NUMARTICLEID;
var url = picUrl.replace('.jpg','_184_108.jpg');
var url1 = picUrl.replace('.jpg','_630_349.jpg');
topSmallPic+="<li><a href='javascript:void(0)' id='smallimage_"+smallimgid+"' smallimage='"+url+"' οnclick='dynamicTopPic("+smallimgid+"); return false;'><image src= "+imageip+"/images/resources"+url+"></a></li>";
}
$("#focus_list").html(topSmallPic);
// alert($('#focus_list'))
},
error:function(){
alert("您好,系统繁忙");
}
});
}
功能需求:比较简单,就是点击左侧小图,动态更换中间大图,为小图的不同尺寸的缩略图。
function dynamicTopPic(smallimgid){
var url = $("#smallimage_"+smallimgid).attr("smallimage");
$('#focus_big').find("#bigImage").attr("src",imageip+"/images/resources"+url);
}