Ayuda con dos JQuery que se anulan

Hola, tengo un problema con dos scripts en JQuery, resulta que tengo una galeria de imagenes JQuery y un cargador,y al poner los dos codigos no me funciona correctamente... si pongo el jquery conflict no me solucionada nada, bueno si, funciona el cargador pero no el carrusel de imagenes... os copie el codigo ok?

<!-- Cargador -->

<script src="js/lib/jquery.min.js" type="text/javascript"></script>
<script src="jquery.queryloader2.min.js" type="text/javascript"></script>
<script src="js/script.js" type="text/javascript"></script>

<!-- Scroll Imagenes -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
<script src="js/jquery.mousewheel.min.js" type="text/javascript"></script>
<script src="js/jquery.smoothdivscroll-1.3-min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("div#makeMeScrollable").smoothDivScroll({

});
});
</script>

<link rel="Stylesheet" type="text/css" href="css/smoothDivScroll.css" />
<style type="text/css">

#makeMeScrollable
{
width:100%;
height: 467px;
position: relative;
}
#makeMeScrollable div.scrollableArea img
{
position: relative;
float: left;
margin: 0;
padding: 0;

-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
body {
background-image: url();
background-color: #DDDCDC;
}
</style>

<link href="css/stls.css" rel="stylesheet" type="text/css">

<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->


</script>


</head>

<div id="makeMeScrollable"><img src="gals/first/1.jpg" width="353" height="467"> <img src="gals/first/2.jpg" width="353" height="467"> <img src="gals/first/3.jpg" width="353" height="467"> <img src="gals/first/4.jpg" width="353" height="467"> <img src="gals/first/5.jpg" width="353" height="467"> <img src="gals/first/6.jpg" width="659" height="410"> <img src="gals/first/7.jpg" width="353" height="467"> <img src="gals/first/8.jpg" width="353" height="467"> <img src="gals/first/9.jpg" width="353" height="467"> <img src="gals/first/10.jpg" width="353" height="467"> <img src="gals/first/11.jpg" width="353" height="467"> <img src="gals/first/13.jpg" width="353" height="467"></div>



<br>
<div class="pie">
<div align="center"><img src="images/social.jpg" width="160" height="38"></div>
</div>

Ese es el problema de combinar "plugins" los plugin estan diseñados para trabajar solos, en este caso tendrias que modificar o crear un solo plugin que haga los dos aspectos que necesitas.

No hay solución facil ni directa a tu problema, asi que recuerda esta regla si aun no le sabes mucho al jquery y JS para poder modificar plugins y es:

Solo poner un plugin por elemento (ya sea div, class o lo que sea), si pones más de uno no es que se contrareste, si no que estas aplicando 2 acciones no compatibles a un solo elemento.

La solucion rapida es crear un div dentro del div y ya le aplicas el segundo plugin.

Saludos,
Simple, solo crea un nuevo DIV ID

Gracias, lo voy aprobar!