//在文档完全加载后想运行某个函数,用下面的函数addLoadEvent
function addLoadEvent(func){
var oldonload = window.onload;
if(typeof window.onload !='function'){
window.onload = func;
}else{
window.onlad = function(){
oldonload();
func();
}
}
}
//insertAfter函数,与insertBefore对应
function insertAfter(newElement,targetElement){
var parent = targetElement.parentNode;
if(parent.lastChild == targetElement){
parent.appendChild(newElement);
}else{
parent.insertBefore(newElement,targetElement.nextSibling);
}
}
//addClass
function addClass(element,value){
if(!element.className){
element.className = value;
}else{
newClassName = element.className;
newClassName += " ";
newClassName += value;
element.className = newClassName;
}
}
//highlightPage
function highlightPage(){
if(!document.getElementsByTagName) return false;
if(!document.getElementById) return false;
var headers = document.getElementsByTagName('header');
if(headers.length == 0) return false;
var navs = headers[0].getElementsByTagName('nav');
if(navs.length == 0) return false;
var links = navs[0].getElementsByTagName('a');
for(var i=0; i<links.length; i++){
linkurl = links[i].getAttribute('href');
if(window.location.href.indexOf(linkurl)!=-1){
links[i].className = "now";
var linktext = links[i].lastChild.nodeValue.toLowerCase();
document.body.setAttribute("id",linktext);
}
}
}
addLoadEvent(highlightPage);
//动画函数
function moveElement(elementID,final_x,final_y,interval){
if(!document.getElementById) return false;
if(!document.getElementById(elementID)) return false;
var elem = document.getElementById(elementID);
if(elem.movement){
clearTimeout(elem.movement);
}
var xpos = parseInt(elem.offsetLeft);
var ypos = parseInt(elem.offsetTop);
if(xpos == final_x && ypos == final_y){
return true;
}
if(xpos<final_x){
var dist = Math.ceil((final_x - xpos)/10);
xpos = xpos + dist;
}
if(xpos>final_x){
var dist = Math.ceil((xpos - final_x)/10);
}
if(ypos<final_y){
var dist = Math.ceil((final_y - ypos)/10);
ypos = ypos + dist;
}
if(ypos>final_y){
var dist = Math.ceil((ypos - final_y)/10);
ypos = ypos - dist;
}
elem.style.left = xpos + "px";
elem.style.top = ypos + "px";
var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";
elem.movement = setTimeout(repeat,interval);
}
function prepareSlideshow(){
if(!document.getElementsByTagName) return false;
if(!document.getElementById) return false;
if(!document.getElementById("intro")) return false;
var intro = document.getElementById("intro");
var slideshow = document.createrElement("div");
slideshow.setAttribute("id","slideshow");
var frame = document.createElement("img");
frame.setAttribute("src","images/frame.gif");
frame.setAttribute("alt","");
frame.setAttribute("id","frame");
slideshow.appendChild(frame);
var preview = document.createElement("img");
preview.setAttribute("src","images/slideshow.gif");
preview.setAttribute("alt","a glimpse of what awaits you");
preview.setAttribute("id","preview");
slideshow.appendChild(preview);
insertAfter(slideshow,intro);
var links = document.getElementsByTagName("a");
var destination;
for(var i=0; i<links.length; i++){
links[i].onmouseover = function(){
destination = this.getAttribute("href");
if(destination.indexOf("index.html")!=-1){
moveElement("preview",0,0,5);
}
if(destination.indexOf("about.html")!=-1){
moveElement("preview",-150,0,5);
}
if(destination.indexOf("photos.html")!=-1){
moveElement("preview",-300,0,5);
}
if(destination.indexOf("live.html")!=-1){
moveElement("preview",-450,0,5);
}
if(destination.indexOf("contact.html")!=-1){
moveElement("preview",-600,0,5);
}
}
}
}
addLoadEvent(prepareSlideshow);
function showSection(id){
var sections = document.getElementsByTagName("section");
for(var i=0; i<sections.length; i++){
if(sections[i].getAttribute("id")!=id){
sections[i].style.display = "none";
}else{
sections[i].style.display = "block"
}
}
}
function prepareInternalnav(){
if(!document.getElementsByTagName) return false;
if(!document.getElementById) return false;
var articles = document.getElementsByTagName("article");
if(articles.length ==0) return false;
var navs = articles[0].getElementsByTagName("nav");
if(navs.length ==0) return false;
var nav = navs[0];
var links = nav.getElementsByTagName("a");
for(var i=0; i<links.length; i++){
var sectionId = links[i].getAttribute("href").split("#")[1];
if(!document.getElementById(sectionId)) continue;
document.getElementById(sectionId).style.display = "none";
links[i].destination = sectionId;
links[i].onclick = function(){
showSection(this.destination);
return false;
}
}
}
addLoadEvent(prepareInternalnav);
//表格隔行变色
function stripetables(){
if(!document.getElementsByTagName) return false;
var tables = document.getElementsByTagName("table");
for(var i=0; i<tables.length; i++){
var odd = false;
var rows = tables[i].getElementsByTagName("tr");
for(var j=0; j<rows.length; j++){
if(odd == true){
addClass(row[j],"odd");
odd = false;
}else{
odd = true;
}
}
}
}
//表格鼠标移上变色
function highlightrows(){
if(!document.getElementsByTagName) return false;
var rows = document.getElementsByTagName("tr");
for(var i=0; i<rows.length; i++){
rows[i].oldClassName = rows[i].className;
rows[i].onmouseover = function(){
addClass(this,"highlight");
}
rows[i].onmouseout = function(){
this.className = this.oldClassName;
}
}
}
//提取页面中的注释
function displayabbreviations(){
if(!document.getElementsByTagName || !document.createElement || !document.createTextNode) return false;
var abbreviations = document.getElementsByTagName("abbr");
if(abbreviations.length<1) return false;
var defs = new Array();
for(var i=0; i<abbreviations.length; i++){
var current_abbr = abbreviations[i];
if(current_abbr.childNodes.length<1) continue;
var definition = current_abbr.getAttribute("title");
var key = current_abbr.lastChild.nodeValue;
defs[key] = definition;
}
var dlist = document.createElement("dl");
for(key in defs){
var definition = defs[key];
var dtitle = document.createElement("dt");
var dtitle_text = document.createTextNode(key);
dtitle.appendChild(dtitle_text);
var ddesc = document.createElement("dd");
var ddesc_text = document.createTextNode(definition);
ddesc.appendChild(ddesc_text);
dlist.appendChild(dtitle);
dlist.appendChild(ddesc);
}
if(dlist.childNodes.length<1) return false;
var header = document.createElement("h3");
var header_text = document.createTextNode("abbreviations");
header.appendChild(header_text);
var articles = document.getElementsByTagName("article");
if(articles.length == 0) return false;
var container = articles[0];
container.appendChild(header);
container.appendChild(dlist);
}
addLoadEvent(stripetables);
addLoadEvent(highlightrows);
addLoadEvent(displayabbreviations);
//为不支持placeholder的浏览器添加这个功能
function resetfields(whichform){
if(Modernizr.input.placeholder) return ;
for(var i=0; i<whichform.elements.length;i++){
var element = thichform.elements[i];
if(element.type == 'submit') continue;
var check = element.placeholder || element.getAttribute('placeholder');
if(!check) continue;
element.onfocus = function(){
var text = this.placeholder || this.getAttribute('placeholder');
if(this.value == text){
this.className = '';
this.value = '';
}
}
element.onblur = function(){
if(this.value == ''){
this.className = 'placeholder';
this.value = this.placeholder || this.getAttribute('placeholder');
}
}
element.onblur();
}
}
function prepareforms(){
for(var i=0; i<document.forms.length; i++){
var thisform = document.forms[i];
resetfields(thisform);
}
}
addLoadEvent(prepareforms);
//表单验证
function isfilled(field){
if(field.value.replace(' ','').length == 0) return false;
var placeholder = field.placeholder || field.getAttribute("placeholder");
return (field.value!=placeholder);
}
function isemail(field){
return (field.value.indexOf("@") != -1 && field.value.indexOf(".") !=-1);
}
function validateform(whichform){
for(var i=0; i<whichform.elements.length; i++){
var element = thichform.elements[i];
if(element.required == 'required'){
if(!isfilled(element)){
alert("Please fill in the "+element.name+" field.");
return false;
}
}
if(element.type == 'email'){
if(!isemail(element)){
alert("the "+element.name+ "field must be a valid email address.");
return false;
}
}
}
return false;
}
function prepareforms(){
for(var i=0; i<document.forms.length; i++){
var thisform = document.forms[i];
resetfields(thisform);
thisform.onsubmit = function(){
return validateform(this);
}
}
}
//ajax
function getHTTPObject(){
if(typeof XMLHttpRequest == "undefined"){
XMLHttpRequest = function(){
try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
catch(e){}
try{return new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){}
return false;
}
}
return new XMLHttpRequest();
}
function displayAjaxLoading(element){
while(element.hasChildNodes()){
element.removeChild(element.lastChild);
}
var content = document.createElement("img");
content.setAttribute("src","images/loading.gif");
content.setAttribute("alt","Loading...");
element.appendChild(content);
}
function submitFormWidthAjax(whichform,thetarget){
var request = getHTTPObject();
if(!request){return false;}
displayAjaxLoading(thetarget);
var dataParts = [];
var element;
for(var i=0; i<whichform.elements.length; i++){
element = whichform.elements[i];
dataParts[i] = element.name + '=' + encodeURIComponent(element.value);
}
var data = dataParts.join('&');
request.open("POST",whichform.getAttribute("action"),true);
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.onreadystatechange = function(){
if(request.readyState == 4){
if(request.status == 200 || request.status == 0){
var matches = request.responseText.match(/<article>([\s\S]+)<\/article>/);
if(matches.length>0){
thetarget.innerHTML = matches[1];
}else{
thetarget.innerHTML = '<p>Oops,there was an error. Sorry.</p>';
}
}else{
thetarget.innerHTML = '<p>' + request.statusText + '</p>';
}
}
};
request.send(data);
return true;
}
function prepareForms(){
for(var i=0; i<document.forms.length; i++){
var thisform = document.forms[i];
resetFields(thisform);
thisform.onsubmit = function(){
if(!validateForm(this)) return false;
var article = document.getElementsByTagName("article")[0];
if(submitFormWithAjax(this,article)) return false;
return true;
}
}
}