function activateDecativatePointNavElements (activeEl, inactiveEl1, inactiveEl2) {
	jQuery(activeEl).addClass('active');
	jQuery(inactiveEl1).removeClass('active');
	jQuery(inactiveEl2).removeClass('active');
}

jQuery(document).ready(function() {

  //karusell auf elemente anwenden
  jQuery('#flow').roundabout({childSelector: 'div', minScale: 0.8, minOpacity: 0.6, maxOpacity: 1.0});

  //click handler für das erste bild
  jQuery('#img1').click(function() {
		activateDecativatePointNavElements("#img1","#img2","#img3");
    jQuery('#flow').roundabout_animateToChild(0); 
  });

  //clickhandler für das zweite bild
  jQuery('#img2').click(function() {
		activateDecativatePointNavElements("#img2","#img1","#img3");
    jQuery('#flow').roundabout_animateToChild(1); 
  });

  //clickhandler für das dritte bild
  jQuery('#img3').click(function() {
		activateDecativatePointNavElements("#img3","#img1","#img2");
	  jQuery('#flow').roundabout_animateToChild(2); 
  });

	jQuery('#flow div').click(function() { 
		var tid = jQuery(this).attr("id").substr(6,6);
		if(tid == "1") {
			activateDecativatePointNavElements("#img1","#img2","#img3");
		} else if(tid == "2") {
			activateDecativatePointNavElements("#img2","#img1","#img3");
		}	else if(tid == "3") {
			activateDecativatePointNavElements("#img3","#img1","#img2");
		}
	});

});