advimage.js

一、修改产品详细页面的附件块 二、添加上浏览历史模块 三、在后台加入自定义首页、自定义页头、自定义页脚内容功能 四、在后台修改网站全局CSS样式文件功能 五、在后台修改每个模块的模板内容功能

var Tools = {
		getElemenetObj : function(ElementId)
		{
			return typeof(ElementId)=='string' ? document.getElementById(ElementId) : ElementId;
		},
		isNull : function (value)
		{
			return typeof(value)=='undefined'||
				   typeof(value)== undefined ||
				   value == null ||
				   value == '';
		},
		Event : function(e)
		{
			var oEvent = document.all ? window.event : e;
			if(document.all)
			{
				if(oEvent.type == 'mouseout')
					oEvent.relatedTarget = oEvent.toElement;
				else if(oEvent.type = 'mouseover')
					oEvent.relatedTarget = oEvent.fromElement;
			}
			return oEvent;
		},
		registerEventHandler : function(oElement,sEventType,fnEventHandler)
		{
			if(oElement.addEventListener)
				oElement.addEventListener(sEventType,fnEventHandler,false)
			else if(oElement.attachEvent)
				oElement.attachEvent('on'+sEventType,fnEventHandler)
			else 
				oElement['on'+sEventType] = fnEventHandler;
		},
		extend : function(oReturn,oSrc)
		{
			if(this.isNull(oSrc))
			{
				alert('Param Error for Tools.extend(),the param oSrc\' type:'+typeof(oSrc));
				return false;
			}
			for(var proprety in oSrc)
			{
				oReturn[proprety] = oSrc[proprety];
			}
			return oReturn;
		},
		getAgent : function()
		{
		  return (typeof document.implementation != 'undefined')&&
		         (typeof document.implementation.createDocument != 'undefined')&&
		         (HTMLDocument != 'undefined') ? 'Mozilla' : 
		        	 window.ActiveXObject ? 'IE' : 
		        		 navigator.userAgent.toLowerCase().indexOf('firefox')!= -1 ? 'FireFox' :
		        			 navigator.userAgent.toLowerCase().indexOf('safari') != -1 ? 'Safari' :
		        				 navigator.userAgent.toLowerCase().indexOf('opera') != -1 ? 'Opera' :
		        					 'IE';
		}
};

		//图片效果类
		//创建类的实例化，初级构造函数，降低类的使用复杂程度
		//use syntax like prototype.js
var classes = {
create:function(){
	return function(){
		this.init.apply(this,arguments);	
	}
}
};
var imageslide = new classes.create();
imageslide.prototype = {
	ShowType:Array(
			1,  //展示方法1：图片滑动
			2,  //方法2：幻灯片
			3   //方法3：走马灯效果
			),
	//构造函数
	//        name          type         element(value)
	//@param: aContainer   Array         ContainerId,ContainerWidth
	//        aShowimage   Array         ShowimageElement, ShowimageMaxWidth
    //        aOptions     Array         Step,Time,TextElement,TextHeight
	//        iShowType    int           1,2,3
	init : function(aContainer,aShowimage,aOptions,iShowType)
	{
		if(iShowType==this.ShowType[0])
		{
			var oContainer = Tools.getElemenetObj(aContainer.ContainerId);
		    var oSelf = this;
			var len = 0;
			
			this.SetOptions(aOptions);
			
			this.Step = Math.abs(this.Options.Step);
			this.Time = Math.abs(this.Options.Time);
		     
			this.Children = oContainer.getElementsByTagName(aShowimage.ShowimageElement);
			len = this.Children.length;
			this.CountChild = len;
			this.ChildWidth = parseInt(aContainer.ContainerWidth/len);
			this.ChildWidthMax = parseInt(aShowimage.ShowimageMaxWidth);
			this.ChildWidthMin = parseInt((aContainer.ContainerWidth-this.ChildWidthMax)/(len-1));
			this.Timers = null;
			
			//是否显示说明文本
			if(this.Options.TextElement && this.Options.TextHeight>0)
			{
				this.Showtext = true;
				this.TextElement = oContainer.getElementsByTagName(this.Options.TextElement);
				this.TextHeight = -parseInt(this.Options.TextHeight);
			};
			//初始化并注册函数
			this.Each(function(oChildren,oText,i){
				oChildren._target = this.ChildWidth*i;
				oChildren.style.left = oChildren._target+'px';
				oChildren.style.position = 'absolute';
				Tools.registerEventHandler(oChildren,'mouseover',function(){oSelf.Set.call(oSelf,i);});
				if(oText)
				{
					oText._target = this.TextHeight;
					oText.style.bottom = oText._target+'px';
					oText.style.position = 'absolute';
				}
			});
			//容器设置
			oContainer.style.width = aContainer.ContainerWidth+'px';
			oContainer.style.overflow = 'hidden';
			oContainer.style.position = "relative";
			
			
			//恢复默认状态
			Tools.registerEventHandler(oContainer,'mouseout',function(e)
				{
				//变通防止执行Child mouseout
					var o = Tools.Event(e).relatedTarget;
                          //alert(o.tagName);
					if(oContainer.contains ? 
						!oContainer.contains(o):
							oContainer != o && !(oContainer.compareDocumentPosition(o) & 16))
					oSelf.Set.call(oSelf,-1);
			    });
			
		}
		else if(iShowType == this.ShowType[1])
		{
			
		}
		else if(iShowType == this.ShowType[3])
		{};
	},
	
	//设置默认属性，滑动方式
	SetOptions : function(aOptions)
	{
		this.Options = {
			Step          : 20,//滑动步长
			Time          : 20,//滑动延时
			TextElement   : '', //文字元素容器
			TextHeight    : 0  //文字元素容器高度
		};
		Tools.extend(this.Options,aOptions);
	},
	
	//相关设置
	Set : function (index)
	{
		if(index<0)
			this.Each(function(oChildren,oText,i)
					{
						oChildren._target = this.ChildWidth*i;
						if(oText)
						{
							oText._target = this.TextHeight;
						}
					});
		else	
		{
			this.Each(function(oChildren,oText,i){
				oChildren._target = (i<=index)? this.ChildWidthMin*i : this.ChildWidthMin*(i-1)+this.ChildWidthMax;
				if(oText)
				{
					oText._target = (i==index) ? 0 : this.TextHeight;
				}
			});
		}
		this.Move();
	},
	//
	
	//移动
	Move : function()
	{
		clearTimeout(this.Timers);
		var bFinish = true; //状态字，看是否达到目标
		this.Each(function(oChildren,oText,i)
				{
					var iNow = parseInt(oChildren.style.left), iStep = this.GetStep(oChildren._target,iNow);
					if(iStep != 0)
					{
						bFinish = false;
						oChildren.style.left = (iNow+iStep)+'px';
					}
					if(oText)
					{
						iNow = parseInt(oText.style.bottom),iStep=this.GetStep(oText._target,iNow);
						if(iStep != 0)
						{
							bFinish = false;
							oText.style.bottom = (iNow+iStep)+'px';
						}
					}
				});
		//未达目标继续移动
		if(!bFinish){
			var oSelf = this;
			this.Timers = setTimeout(function(){oSelf.Move();},this.Time);
		};
	},
	
	GetStep : function(iTarget,iNow) 
	{
		var iStep = (iTarget - iNow)/this.Step;
		if(iStep==0)return 0;
		if(Math.abs(iStep)<1)return(iStep>0? 1 : -1);
		return iStep;
	},
	Each : function(fnMethod)
	{
		for(var i=0; i < this.CountChild; i++)
		{
			fnMethod.call(this,this.Children[i],(this.Showtext ? this.TextElement[i] : null),i);
		}
	}
};
//window.onload=function(){
//alert('asdfasdf');
//	acont = Array();
//	acont.ContainerId = 'idGlideView';
//	acont.ContainerWidth = 900;
//	show = Array();
//	show.ShowimageElement = 'div';
//	show.ShowimageMaxWidth = 800;
//	new imageslide(acont, show, { TextElement: "a", TextHeight: 100 },1);
//}