猫头鹰旋转木马2将自己设置为不显示

我试图让owl carousel 2在我的php网站上工作。我在Anguler网站上使用了完全相同的代码，当然除了功能之外。所以这应该有效。这是我的脚本和链接

jQuery(document).ready(function(){
  jQuery('#owl2').owlCarousel({
    navigation: true,
    nav: true,    
    dots: false,
    margin: 50,
    dotsEach: false,
    dotData: false,
    center: true,
    autoWidth: true,
    items: 5,
    center:true,
    slideSpeed: 300,
    paginationSpeed: 400,                        
    autoPlay: false,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:3
        },
        1000:{
            items:5
        }
        }
    });
});

html

 <div class="container">
    <div class="row">
        <div class="col-md-12">            
                <div id="owl2" class="owl-carousel owl-theme">
                    <div class="item verticle-align">
                        <img class="verticle-align" src="img/metabo.png" alt="">
                    </div>
                    <div class="item">
                        <img class="verticle-align" src="img/aeroquip.png" alt="">
                    </div>
                    <div class="item">
                        <img class="verticle-align" src="img/IR.png" alt="">
                    </div>
                    <div class="item">
                        <img class="verticle-align" src="img/huck.png" alt="">
                    </div>
                    <div class="item">
                        <img class="verticle-align" src="img/infasco.png" alt="">
                    </div>   
                    <div class="item">
                        <img class="verticle-align" src="img/metabo.png" alt="">
                    </div>   
                    <div class="item">
                        <img class="verticle-align" src="img/chicago-pneumatic.jpg" alt="">
                    </div> 
                    <div class="item">
                        <img class="verticle-align" src="img/Gesipa.jpg" alt="">
                    </div>               
                </div>            
        </div>
    </div>
</div> 

和我的链接

 <!-- Bootstrap -->
    <link rel="stylesheet" type="text/css" href="css/boot/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="css/boot/bootstrap-theme.css">

    <!--owl css-->
    <link rel="stylesheet" type="text/css" href="css/owl_carousel/owl.carousel.css">
    <link rel="stylesheet" type="text/css" href="css/owl_carousel/owl.theme.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.transitions.min.css" >
    <!--Other CSS files-->
    <link rel="stylesheet" type="text/css" href="css/responsive.css">
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <link rel="stylesheet" type="text/css" href="css/fa/font-awesome.css">
    <!--Jquery-->
    <script src="js/jquery-2.2.3.min.js"></script>

    <!-- Bootstrap JS -->
    <script src="js/boot/bootstrap.js"></script>
    <!--<script src="js/boot/bootstrap.min.js"></script>-->
    <!--Other Js files-->    
    <script src="js/main.js"></script>
    <script src="js/owl/owl.carousel.js"></script>

我以前已经做过很多次了，但这次似乎无法发挥作用。有人知道我做错了什么吗？

我被要求在页面上添加我正在使用的第二个转盘，下面是所述转盘的html/js

<div id="owl" class="owl-carousel owl-theme">
                <div class="item first-item">
                    <div class="products-images">
                        <a href="./img/catalog/9-Assortments-Storage.pdf"     target="_blank">Assortments</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/4-Tools.pdf"               target="_blank">Tools</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/4-Tools.pdf" target="_blank">Cutting Tools</a>
                    </div>
                </div>
                <div class="item active">
                    <div class="products-images ">
                        <a href="./img/catalog/7-Brass.pdf" target="_blank">Fittings</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/6-Electrical.pdf" target="_blank">Electrical</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/1-Fasteners.pdf" target="_blank">Fasteners</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/2014Safety.pdf" target="_blank">Saftey</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/5-ShopSupplies.pdf" target="_blank">Shop Supplies</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/2-Rivets-Huck.pdf" target="_blank">Rivets</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/2014CustomPackaging.pdf" target="_blank">Custom Packaging</a>
                    </div>
                </div>
                <div class="item">
                    <div class="products-images">
                        <a href="./img/catalog/3-Chemicals.pdf" target="_blank">Chemicals</a>
                    </div>
                </div>
            </div>
<script type="text/javascript">
jQuery(document).ready(function(){
  jQuery('#owl').owlCarousel({
    navigation: true,
    nav: true,    
    dots: false,
    dotsEach: false,
    dotData: false,
    center: true,
    autoWidth: true,
    items: 7,
    center:true,
    slideSpeed: 300,
    paginationSpeed: 400,                        
    autoPlay: false,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:3
        },
        1000:{
            items:5
        }
        }
    });
});
</script>