$("document").ready(function(){
    if (navigator.userAgent.toLowerCase().indexOf('applewebkit') == -1) { 
  // preload
  left = new Image();
  left.src = 'images/left.png';
  top_left = new Image();
  top_left.src = 'images/top_left.png';
  top_right = new Image();
  top_right.src = 'images/top_right.png';
  right = new Image();
  right.src = 'images/right.png';
  bottom_left = new Image();
  bottom_left.src = 'images/bottom_left.png';
  bottom_right = new Image();
  bottom_right.src = 'images/bottom_right.png';

  function setBg(elem) {
    if (document.getElementById) {
      box = elem.parentNode.parentNode;
      box.style.background = 'url(images/left.png) repeat-y left';
      box.childNodes[0].style.background = 'url(images/top_left.png) no-repeat top left';
      box.childNodes[0].childNodes[0].style.background = 'url(images/top_right.png) no-repeat top right';
      box.childNodes[1].style.background = 'url(images/right.png) repeat-y right';
      box.childNodes[1].childNodes[0].style.border = '1px solid #fff';
      box.childNodes[2].style.background = 'url(images/bottom_left.png) no-repeat bottom left';
      box.childNodes[2].childNodes[0].style.background = 'url(images/bottom_right.png) no-repeat bottom right';
    }
  }

  function removeBg(elem) {
    if (document.getElementById) {
      box = elem.parentNode.parentNode;
      box.style.background = 'transparent';
      box.childNodes[0].style.background = 'transparent';
      box.childNodes[0].childNodes[0].style.background = 'transparent';
      box.childNodes[1].style.background = 'transparent';
      box.childNodes[1].childNodes[0].style.border = '1px solid #b2b2b2';
      box.childNodes[2].style.background = 'transparent';
      box.childNodes[2].childNodes[0].style.background = 'transparent';
    }
  }
}
    
    $("#whytu div:first").css('left','0');
    var current = $("#whytu div:first");
    var t = 8000;
    var en = true;
    var ps = true;
                
    var timer = setInterval(function(){
        rotat();
    },t);
                
    $("#why a").hover(function(){
        clearInterval(timer);
    },function(){
        timer = setInterval(function(){
            rotat();
        },t);
    });
                
    $(".left a").click(function(){
        if(en){
            revrotat();
        }
    });
                
    $(".right a").click(function(){
        if(en){
            rotat();
        }
    });
    
    $(".pause a").click(function(){
        if(ps){
            //            pause
            clearInterval(timer);
            
        }else{
            //            play
            timer = setInterval(function(){
                rotat();
            },t);
        }
    });
                
    function rotat(){
        en = false;
        current.animate({
            left : '-540'
        }, 2000);
        current.animate({
            left : '540'
        }, 0);
        current = current.next('div');
        if(current.length==0){
            current = $("#whytu div:first");
        }
        current.animate({
            left : '0'
        }, 2000,function(){
            en = true;
        });
    }
                
    function revrotat(){
        en = false;
        current.animate({
            left : '540'
        }, 2000);
        current = current.prev('div');
        if(current.length==0){
            current = $("#whytu div:last");
        }
        current.animate({
            left : '-540'
        }, 0);
        current.animate({
            left : '0'
        }, 2000,function(){
            en = true;
        });
    }
                
});