$(document).ready(function() {
              	  $('#gallery-list li a').bind('click', function(event) {
              		  $('#gallery-photo img').attr('src', $(this).attr('href'));
                		$('#gallery-list li a').removeClass('active');
              		  $(this).addClass('active');
              		  event.preventDefault();
                  });
                	$('#gallery-list a.next').bind('click', function(event) {
                    cur = $('#gallery-list li').index($('#gallery-list li a.active').parent());
                    size = $('#gallery-list li').size();

                    if (cur+1 >= size) cur = -1;
                    
                    element = $('#gallery-list li').get(cur+1);
                    element = $(element).find('a');
                    
                  	$('#gallery-photo img').attr('src', $(element).attr('href'));
                  	$('#gallery-list li a').removeClass('active');
                    $(element).addClass('active');

                    gallery_moveview($('#gallery-list ul'), element);
                    
                    event.preventDefault();
                  });

                  $('#gallery-list a.previous').bind('click', function(event) {
                    cur = $('#gallery-list li').index($('#gallery-list li a.active').parent());
                    size = $('#gallery-list li').size();

                    if (cur+1 <= 0) cur = size+1;
                    
                    element = $('#gallery-list li').get(cur-1);
                    element = $(element).find('a');
                    
                    $('#gallery-photo img').attr('src', $(element).attr('href'));
                    $('#gallery-list li a').removeClass('active');
                    $(element).addClass('active');

                    gallery_moveview($('#gallery-list ul'), element);
                    
                    event.preventDefault();
                  });
                });

                function gallery_moveview(list, element) {
              	  elheight = $(element).parent().height();
              	  index = $(list).find('li').index($(element).parent());
              	  if (index > 2) {
              	   movement = elheight * (index-2);
              	  } else {
                   movement = 0;
              	  }
              	  console.log(elheight);
                  console.log(index);
                  $(list).css('top', '-'+movement+'px');
                }