Eso pasa por que al usar frameworks pueden "chocar", jquery usa como selector(no se si se dice así) el signo $, y creo que prototype también, lo que puedes hacer es poner antes de las funciones de jquery
y asi lo puedes usar normalmente, aunque te puede dar problemas dependiendo de la ubicación del script en el documento, lo más recomendable sería que usaras solo 1 framework, ya sea jQuery o prototype, los 2 son muy buenos y hacen casi lo mismo.
Otra cosa es que estuve leyendo es que el prototype como que modifica todo el entorno o algo así y que es dificil integrarlo a otros frameworks o funciones que hagas por tu cuenta.
Prueba esto entonces(en esta parte especificamente):
<script type="text/javascript">
jQuery.noConflict();
$(document).ready(function() {
$('.scroller').click(function() {
var clicked = $(this).attr("href");
var destination = $(clicked).offset().top;
$("html:not(:animated),body:not(:animated)").ani ma te({ scrollTop: destination-20}, 500 );
return false;
});
});
</script>
Creo que talvez te pueda funcionar así