[snippet] image carousel

var switchImg=function(){
			var currentBtn,currentIndex,lastIndex=btn.filter("."+focusClass).index();
			triggerType=$(this).hasClass(dir.attr("class"))?3:(this==window)?2:0;;
			img.add(btn).add(rel).stop(false,true);
			switch(triggerType){
				case 3:		//for dir trigger
					if($(this).attr("id").indexOf("Left")!=-1)currentBtn=lastIndex==0?$(btn[img.length-1]):$(btn[lastIndex-1]);
					else currentBtn=lastIndex==img.length-1?$(btn[0]):$(btn[lastIndex+1]);
					break;
				case 2:		//for auto trigger
					currentBtn=lastIndex==img.length-1?$(btn[0]):$(btn[lastIndex+1]);
					break;
				case 0:		//for mouseover trigger
				default:
					clearInterval(carousel);
					currentBtn=$(this);
			}
			currentIndex=currentBtn.index();
			if(lastIndex==currentIndex) return false;
			$(img[lastIndex]).css("z-index",zIndex+1).fadeOut(effectSpeed,function(){$(this).css("z-index",zIndex)});
			$(img[currentIndex]).show();
			if(relContent) {$(rel[lastIndex]).fadeOut(effectSpeed);$(rel[currentIndex]).fadeIn(effectSpeed);}
			btn.removeClass(focusClass);
			currentBtn.addClass(focusClass);
			}
		for(var i=0;i<img.length;i++) btn.append($("<li>"));
		btn=btn.children();
		btn.first().addClass(focusClass);
		btn.mouseover(switchImg);
		btn.parent().add(dir).mouseleave(function(){carousel=setInterval(switchImg,carouselSpeed);});
		dir.mouseenter(function(){clearInterval(carousel);});
		if(dir.length){
			btnLeft=$(imgBox+"_Left");
			btnRight=$(imgBox+"_Right");
			btnLeft.add(btnRight).click(switchImg);
			}
		if(carouselSpeed) carousel=setInterval(switchImg,carouselSpeed);
		}

 

css

#imgBox_Left,#imgBox_Right{
	position:absolute;
	top:65px;
	cursor:pointer;
	width:150px;
	height:547px;
	z-index:9999;
	background-image: url(data:image/gif;base64,AAAA); /*fix ie bug*/}
#imgBox_Left{
	left:50px;}
#imgBox_Left:hover{
	background:url(../images/left.png) center center no-repeat;}
#imgBox_Right{
	right:50px;}
#imgBox_Right:hover{
	background:url(../images/right.png) center center no-repeat;}
#btn{
	width:auto;
	height:15px;
	position:absolute;
	left:50%;
	margin-left:-36px;
	top:580px;
	cursor:pointer;
	z-index:999;}
#btn li{
	display:block;
	height:10px;
	width:10px;
	float:left;
	margin-right:8px;
	border:1px solid #fff;
	border-radius:10px;}
#btn li:hover,.focusClass{
	background:#FFF;}

 Add "imgBox_Dir" class for your direction trigger.