var pages = new Array( "welcome", "osteo", "psy", "massage", "buteyko", "naturo" ); var pageIdx = 0; var pageCount = pages.length; var pageDelay = 5000; var pageTick = 20; var pageWidth = 700; var currentPosition; var increment; var currentPage; var nextPage; function initAnim() { if ( document.getElementById( "feature_welcome" ) ) { window.setTimeout( changePage, pageDelay ); } } function changePage() { var currentId = "feature_" + pages[pageIdx]; var nextId = "feature_" + pages[pageIdx = ++pageIdx % pageCount]; var sidebarId = pages[pageIdx] + "_sidebar"; currentPage = document.getElementById( currentId ); nextPage = document.getElementById( nextId ); var sidebar = document.getElementById( sidebarId ); for ( var i = 0 ; i < pageCount ; i++ ) { var buttonId = pages[i] + "_sidebar"; var button = document.getElementById( buttonId ); if ( button ) { button.setAttribute( "class", pages[i] + "_sidebar" ); button.className = pages[i] + "_sidebar"; } } if ( sidebar ) { sidebar.setAttribute( "class", pages[pageIdx] + "_sidebar_focus" ); sidebar.className = pages[pageIdx] + "_sidebar_focus"; } var header = document.getElementById( "main_heading" ); header.style.backgroundImage = "url( images/" + pages[pageIdx] + "/bg_header.jpg )"; currentPosition = 0; increment = 2; setTimeout( slidePage, pageTick ); } function slidePage() { if ( currentPosition < pageWidth ) { nextPage.style.zIndex = 15; currentPosition += increment++; newWidth = pageWidth - currentPosition; if ( newWidth < 0 ) { newWidth = 0; } currentPage.style.width = newWidth + 'px'; setTimeout( slidePage, pageTick ); } else { nextPage.style.zIndex = 20; currentPage.style.zIndex = 10; currentPage.style.width = pageWidth + 'px'; setTimeout( changePage, pageDelay ); } }