//box-scroll
//pic-wall
var createPicWall = function(html) {
	var juqery = $;
	var wall = juqery("#picwall");
    
	var wallHtml =html;
	juqery(".pics",wall).html(wallHtml);
	
	var isWallInner;
	var onPic;
	var targetPic;
	
	var Info = {
	  show:function() {
	    juqery(".pic-info").show().css({
	      top:targetPic.position().top,
		  left:function() { return onPic.hasClass("r") ? parseInt(targetPic.css("left")) - 141 : parseInt(targetPic.css("left")) + 60; }
	    });
		juqery(".pic-info p").html(targetPic.attr("val1"));
		juqery(".pic-info span").html(targetPic.attr("val2"));
	  },
	  close:function() {
	    juqery(".pic-info").hide();
	  }
	}
	
	wall.bind({
	  "mouseenter":function() { isWallInner = true; },
	  "mouseleave":function() { isWallInner = false; }	
	});
	juqery(".pic",wall).bind({
	  "mouseenter":function() {
		onPic = $(this);
	    juqery(".pic-info").hide();
		juqery(".pic-hover").remove();
		if(!isWallInner) {
		  juqery(".pics",wall).animate({"opacity":0.7},200);
		}
		var pic = $(this);
		targetPic = pic.clone().addClass("pic-hover").appendTo(wall).click(function() {
		   window.location.href = pic.parent().attr("href");
		}).css({
	      top:$(this).position().top,
	      left:$(this).position().left
	    }).bind({
		  "mouseenter":function() {
		    Info.show();
		  },
		  "mouseleave":function() {
		    Info.close();
		    var pic = $(this);
		    window.setTimeout(function() { 
			  if(!isWallInner) $(".pics",wall).animate({"opacity":1},200);
              pic.remove();
		    },1);
		  }
		});
	  }
	});
}