$(document).ready(function(){ /* * Horizontal Layout Navigation Script * * Copyright (c) 2008 Veera Sundar (http://veerasundar.com) * * Date: Aug 17 2008 */ //Global Constants var $SPACER = 40; var $NOTACTIVEOPACITY = .5; //Get the number of page elements in current web page var $numberOfPages = $(".page").size(); var $pageLeftDistance = "100"; var $currentPage = $(".page:first"); //Set Current page as active $currentPage.addClass("activePage"); for(var i=1; i<=$numberOfPages; i++) { $currentPage.css("left",$pageLeftDistance+"px"); //Calculate the left distance for the next page $pageLeftDistance = parseInt($currentPage.css("left")) + parseInt($currentPage.css("width"))+ $SPACER; $currentPage = $currentPage.next(".page"); $currentPage.addClass("notActivePage"); } $("#MessagePanel").click(function(){ $("#MessagePanel").slideToggle("slow"); }); $(".moveBackward").click(function(){ if($(".activePage").prev().size() == 0) { $("#MessagePanel").html("Sorry! You can not go to previous page, as this is the first page! Click here to close this message."); $("#MessagePanel").slideDown("medium"); return; } //This function will take care of moving to previous pages var $currPage,$tmpLeft, $allPages; var $numberOfPages = $(".page").size(); $allPages = $(".page"); for(var $i=0; $i<$numberOfPages;$i++) { if($i==0) { $tmpLeft = parseInt($(".page:last").css("left")); $(".page:last").animate({ left: ($tmpLeft + parseInt($(".page:first").css("width")) + $SPACER)+"px", opacity:$NOTACTIVEOPACITY },500); $currPage = $(".page:last"); }else { $currPage = $currPage.prev(".page"); $currPage.animate({ left: $tmpLeft + "px", opacity:$NOTACTIVEOPACITY },500); $tmpLeft = $tmpLeft - parseInt($currPage.css("width")) - $SPACER; } } $currPage = $(".activePage"); $currPage.removeClass("activePage"); $currPage.addClass("notActivePage"); $currPage.prev(".page").removeClass("notActivePage"); $currPage.prev(".page").addClass("activePage"); $(".activePage").animate({ opacity:1 },200); }); $(".moveForward").click(function(){ if($(".activePage").next().size() == 0) { $("#MessagePanel").html("Sorry! You can not go to next page, as this is the last page! Click here to close this message."); $("#MessagePanel").slideDown("medium"); return; } //This function will take care of moving to next pages var $currPage,$tmpLeft, $allPages; var $numberOfPages = $(".page").size(); $allPages = $(".page"); for(var $i=0; $i<$numberOfPages;$i++) { if($i==0) { $tmpLeft = parseInt($(".page:first").css("left")); $(".page:first").animate({ left: ($tmpLeft- parseInt($(".page:first").css("width")) - $SPACER)+"px", opacity:$NOTACTIVEOPACITY },500); $currPage = $(".page:first"); }else { $currPage = $currPage.next(".page"); $currPage.animate({ left: $tmpLeft + "px", opacity:$NOTACTIVEOPACITY },500); $tmpLeft = $tmpLeft + parseInt($currPage.css("width")) + $SPACER; } } $currPage = $(".activePage"); $currPage.removeClass("activePage"); $currPage.addClass("notActivePage"); $currPage.next(".page").removeClass("notActivePage"); $currPage.next(".page").addClass("activePage"); $(".activePage").animate({ opacity:1 },200); }); });