var activeTab=1;
$(document).ready(function() {
    $('#vh1').hover(
        function() {
            if (activeTab!=1) $(this).css({'left':'-150'});
        },
        function() {
            if (activeTab!=1) $(this).css({'left':'-300'});
        }
    );
    $('#vh1').click(function() {
        $(this).css({'left':'0px'});
        $('#vh2').css({'left':'-300'});
        $('#vh3').css({'left':'-300'});
        $('#vh4').css({'left':'-300'});
        activeTab=1;
        $('.videoGroup1').css('display','inline');
        $('.videoGroup2').css('display','none');
        $('.videoGroup3').css('display','none');
        $('.videoGroup4').css('display','none');
    });
    $('#vh2').hover(
        function() {
            if (activeTab!=2) $(this).css({'left':'-150'});
        },
        function() {
            if (activeTab!=2) $(this).css({'left':'-300'});
        }
    );
    $('#vh2').click(function() {
        $(this).css({'left':'0px'});
        $('#vh1').css({'left':'-300'});
        $('#vh3').css({'left':'-300'});
        $('#vh4').css({'left':'-300'});
        activeTab=2;
        $('.videoGroup1').css('display','none');
        $('.videoGroup2').css('display','inline');
        $('.videoGroup3').css('display','none');
        $('.videoGroup4').css('display','none');
    });
    $('#vh3').hover(
        function() {
            if (activeTab!=3) $(this).css({'left':'-150'});
        },
        function() {
            if (activeTab!=3) $(this).css({'left':'-300'});
        }
    );
    $('#vh3').click(function() {
        $(this).css({'left':'0px'});
        $('#vh1').css({'left':'-300'});
        $('#vh2').css({'left':'-300'});
        $('#vh4').css({'left':'-300'});
        activeTab=3;
        $('.videoGroup1').css('display','none');
        $('.videoGroup2').css('display','none');
        $('.videoGroup3').css('display','inline');
        $('.videoGroup4').css('display','none');
    });
    $('#vh4').hover(
        function() {
            if (activeTab!=4) $(this).css({'left':'-150'});
        },
        function() {
            if (activeTab!=4) $(this).css({'left':'-300'});
        }
    );
    $('#vh4').click(function() {
        $(this).css({'left':'0px'});
        $('#vh1').css({'left':'-300'});
        $('#vh2').css({'left':'-300'});
        $('#vh3').css({'left':'-300'});
        activeTab=4;
        $('.videoGroup1').css('display','none');
        $('.videoGroup2').css('display','none');
        $('.videoGroup3').css('display','none');
        $('.videoGroup4').css('display','inline');
    });
});	
function playVideo(vid)
{
    var player = document.getElementById("videoPlayer");
    player.src = "video/" + vid;
    player.style.visibility = "visible";
    player.style.display = "block";
}