Multiple effects jquery plugins conflicts when adding another js effect -

i have 1 problem using multiple jquery plugins effects works charm while adding plugin it. when newly added plugin works remaining effects not working. new type of issue facing. need regarding .thanks answers, comments, criticisms.

here sample list using currently

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="js/bootstrap.js"></script> <!-- ie10 viewport hack surface/desktop windows 8 bug --> <script src="js/ie10-viewport-bug-workaround.js"></script> <!-- header-change background --> <script src="js/waypoints.min.js"></script> <script src="js/jquery.catslider.js"></script> <script> var nodes = document.queryselectorall('.logo-over li'),     _nodes = [].slice.call(nodes, 0); var getdirection = function(ev, obj) {     var w = obj.offsetwidth,         h = obj.offsetheight,         x = (ev.pagex - obj.offsetleft - (w / 2) * (w > h ? (h / w) : 1)),         y = (ev.pagey - obj.offsettop - (h / 2) * (h > w ? (w / h) : 1)),         d = math.round(math.atan2(y, x) / 1.57079633 + 5) % 4;     return d; }; var addclass = function(ev, obj, state) {     var direction = getdirection(ev, obj),         class_suffix = "";     obj.classname = "";     switch (direction) {         case 0:             class_suffix = '-top';             break;         case 1:             class_suffix = '-right';             break;         case 2:             class_suffix = '-bottom';             break;         case 3:             class_suffix = '-left';             break;     }     obj.classlist.add(state + class_suffix); }; // bind events _nodes.foreach(function(el) {     el.addeventlistener('mouseover', function(ev) {         addclass(ev, this, 'in');     }, false);     el.addeventlistener('mouseout', function(ev) {         addclass(ev, this, 'out');     }, false); }); $(function() {      $('#mi-slider').catslider();  }); var $head = $('#ha-header'); $('.ha-waypoint').each(function(i) {     var $el = $(this),         animclassdown = $el.data('animatedown'),         animclassup = $el.data('animateup');      $el.waypoint(function(direction) {         if (direction === 'down' && animclassdown) {             $head.attr('class', 'ha-header ' + animclassdown);         } else if (direction === 'up' && animclassup) {             $head.attr('class', 'ha-header ' + animclassup);         }     }, {         offset: '100%'     }); }); /*nav-line follow*/ $(function() {     /* add magic line markup via javascript, because ain't gonna work without */     $("#navigation").append("<li id='magic-line'></li>");     /* cache */     var $magicline = $("#magic-line");     $magicline         .width($(".active").width())         .css("left", $(".active a").position().left)         .data("origleft", $magicline.position().left)         .data("origwidth", $magicline.width());      $("#navigation > li").find("a").hover(function() {         $el = $(this);         leftpos = $el.position().left;         newwidth = $el.parent().width();          $magicline.stop().animate({             left: leftpos,             width: newwidth         });     }, function() {         $magicline.stop().animate({             left: $magicline.data("origleft"),             width: $magicline.data("origwidth")         });     }); }); //form jquery(document).ready(function($) {     if ($('.floating-labels').length > 0) floatlabels();      function floatlabels() {         var inputfields = $('.floating-labels .cd-label').next();         inputfields.each(function() {             var singleinput = $(this);             //check if user filling 1 of form fields              checkval(singleinput);             singleinput.on('change keyup', function() {                 checkval(singleinput);             });         });     }      function checkval(inputfield) {         (inputfield.val() == '') ? inputfield.prev('.cd-label').removeclass('float'): inputfield.prev('.cd-label').addclass('float');     } }); $(window).scroll(function(e) {     parallax(); });  function parallax() {     var scrolled = $(window).scrolltop();     $('.magma').css('top', +(scrolled * 0.6) + 'px'); } </script> <script src="js/banner-color-effect/js-color-effect.js"></script> <script src="js/page-transition.js"></script>