$(document).ready(function() {
  
  $("#main_page1").hide();
  $("#main_page2").hide();
  $("#main_page3").hide();
  
  $(".slideshow").cycle({
  fx: 'fade', // or what ever effect you want to use...
  timeout: 8000
  });
  
  
  $("#button1").mouseover(function(){
  $("#main_page1").css("z-index", "50");
  $("#main_page1").animate({ opacity: "show" }, 1);
  $("#main_page2").animate({ opacity: "hide" }, 1);
  $("#main_page3").animate({ opacity: "hide" }, 1);
  }).mouseout(function(){
  $("#main_page1").animate({ opacity: "hide" }, "fast");
  });
  
  $("#button2").mouseover(function(){
  $("#main_page2").animate({ opacity: "show" }, 1);
  $("#main_page1").animate({ opacity: "hide" }, 1);
  $("#main_page3").animate({ opacity: "hide" }, 1);
  }).mouseout(function(){
  $("#main_page2").animate({ opacity: "hide" }, "fast");
  });
  
  $("#button3").mouseover(function(){
  $("#main_page3").animate({ opacity: "show" }, 1);
  $("#main_page2").animate({ opacity: "hide" }, 1);
  $("#main_page1").animate({ opacity: "hide" }, 1);
  }).mouseout(function(){
  $("#main_page3").animate({ opacity: "hide" }, "fast");
  });

});