// JavaScript Document
$(document).ready(function(){
	//Add titles to all word links
	$("a").not($("a").has("img")).attr("title",function(){if(this.innerHTML)return this.innerHTML;});
	$("#work a,#service a").attr("target","_blank");
	//Slider of campus'scenery
	$("#window img:first").addClass("active");
	var imageWidth=$("#window img").width();
	var imageSum=$("#img-reel img").size();
	var imageReelWidth = imageWidth * imageSum;
	$("#img-reel").css({'width':imageReelWidth});
	
	$("#next").click(function(){
		var $oldactive=$("#window img.active");
		var $active=$("#window img.active").next();
		$oldactive.removeClass("active");
		$active.addClass("active");
		if($active.length===0){$("#window img:first").addClass("active");$active=$("#window img:first");}
		var imageNum=$active.attr("rel");
		$("#img-reel").animate({left:-imageWidth*(imageNum-1)},300);
	})
	
	$("#pre").click(function(){
		var $oldactive=$("#window img.active");
		var $active=$("#window img.active").prev();
		$oldactive.removeClass("active");
		$active.addClass("active");
		if($active.length===0){$("#window img:last").addClass("active");$active=$("#window img:last");}
		var imageNum=$active.attr("rel");
		$("#img-reel").animate({left:-imageWidth*(imageNum-1)},300);
	})
	
	$("#pop img").hover(function(){$(this).css('border','1px solid #663300')},function(){$(this).css('border','1px solid #c0c0c0')});
	$("#mail img").hover(function(){$("#mail").css('border','1px solid #663300')},function(){$("#mail").css('border','1px solid #c0c0c0')});
	$("#pre").hover(function(){$(this).css('background-position','0 -57px')},function(){$(this).css('background-position','0 0')});
	$("#next").hover(function(){$(this).css('background-position','-29px -57px')},function(){$(this).css('background-position','-29px 0')});
	
	//Special topic scrolling bottom
	var speed=20;//The bigger,the faster
	var marquee_left=document.getElementById("marquee_left");
	var marquee_left2=document.getElementById("marquee_left2");
	var marquee_left1=document.getElementById("marquee_left1");
		marquee_left2.innerHTML=marquee_left1.innerHTML;
		function Marquee(){
			if(marquee_left2.offsetWidth-marquee_left.scrollLeft<=0){
				marquee_left.scrollLeft-=marquee_left1.offsetWidth;
			}
			else{
				marquee_left.scrollLeft++;
			}
		}
	var MyMar=setInterval(Marquee,speed);
		marquee_left.onmouseover=function() {clearInterval(MyMar)};
		marquee_left.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
	
})