相同的javascript两次导致滑动条上的冲突

我正在尝试使用相同的JavaScript在同一页面上制作图像滑块和文本滑块。但它并没有像预期的那样正常工作。我对此做了一些研究，但我发现的唯一一件事是使用无冲突，但它也不起作用。当我排除数字-1 JavaScript代码数字-2滑块工作正常，但当我包括数字1滑块数字2不能正常工作。有什么方法可以避免彼此冲突吗?如果是这样，我该怎么做呢?下面是我的JavaScript代码:

        <script> //number-2
            sliderInt = 1;
            sliderNext = 2;
            $(document).ready(function() {
                $('#slider > img#1').fadeIn(150);
                startSlider();
            })
            function startSlider() {
                count = $('#slider > img').size();
                loop = setInterval(function() {
                    if(sliderNext > count) {
                        sliderInt = 1;
                        sliderNext = 1;
                    }
                    $('#slider > img').fadeOut(150);
                    $('#slider > img#' + sliderNext).fadeIn(150);
                    sliderInt = sliderNext;
                    sliderNext = sliderNext + 1;
                }, 3000);
            }
            function prev() {
                newSlide = sliderInt - 1;
                showSlide(newSlide);
            }
            function next() {
                newSlide = sliderInt + 1;
                showSlide(newSlide);
            }
            function stopLoop() {
                window.clearInterval(loop);
            }
            function showSlide(id) {
                stopLoop();
                if(id > count) {
                    id = 1;
                }else if(id < 1) {
                    id = count;
                }
                $('#slider > img').fadeOut(150);
                $('#slider > img#' + id).fadeIn(150);
                sliderInt = id;
                sliderNext = id + 1;
                startSlider();
            }
            $('#slider > img').hover(
                function() {
                    stopLoop();
                },
                function() {
                    startSlider();
                }
                // In the End of the line don't put comma ','
            );
        </script>
        <script> //number-1
            textsliderInt = 1;
            textsliderNext = 2;
            $(document).ready(function() {
                $('#slider_text > p#1').fadeIn(300)
                textsliderStart();
            })
            function textsliderStart() {
                count = $('#slider_text > p').size();
                loop = setInterval(function() {
                    if(textsliderNext > count) {
                        textsliderInt = 1;
                        textsliderNext = 1;
                    }
                    $('#slider_text > p').fadeOut(300);
                    $('#slider_text > p#' + textsliderNext).fadeIn(300);
                    textsliderInt = textsliderNext;
                    textsliderNext = textsliderNext + 1;
                }, 3000)
            }
        </script>