Question

我的页面中有2个猫头鹰旋转木马。我的问题是一个完美但另一个。我正在使用php codeigniter。如何解决这个..我不知道如何解决。

1.   <script>    $(document).ready(function(){ $('#owl-carousel1').owlCarousel({
            loop:true,
                        items:3,
                        margin:9,
                        autoplay:true,
                        autoplayHoverPause:true,
                        nav:true,
                        autoplayTimeout:1000,
                        responsiveClass:true,
                        responsive:{
                0:{
                    items:1,
                    nav:true
                },
                600:{
                    items:3,
                    nav:false
                },
                1000:{
                    items:3,            autoplay:true,
                    nav:true,
                    loop:true,          slideBy:3,

                }
            }    }); }); </script>


        <!----view page---->

        <div class="row" style="background-color:#00263A">

                    <div class="container" style="margin-bottom:50px; margin-top:50px" >

                        <div class="owl-carousel" id="owl-carousel2" >
                         <?php
                                        foreach($featuredJobs as $fjobs){   ?>   <?php if($fjobs->attachment_url != '' ) {?>


                            <div class="item"><img src="<?php echo base_url(); ?>files/job_attachment/<?php echo $fjobs->attachment_url;?>"
        width="250" height="250" class="responsive" />
                                <h5><?php echo $fjobs->job_name;?></h5>
                                <span><?php echo $fjobs->job_categories;?></span> <h6><strong><?php echo
        '$'.$fjobs->budget_min.'- $'.$fjobs->budget_max;?></strong></h6>
                                  <a href="<?php if(isset($loggedInUser->id) AND $loggedInUser->id != ''){echo site_url("users/login");}else {
        echo site_url("job/createBid/".$fjobs->id);}?>"> <button
        type="button" class="btn btn-primary pull-left" title=""><i
        class="fa fa-gavel"></i>Bid For This Job</button></a>
                            </div>
                             <?php } } ?>
                        </div>

                    </div>

                </div>

Answer 1

好的，让我给你一些见解。始终交叉检查您的代码，您的Javascript与您的HTML。

您的第一行Javascript是：

$(document).ready(function(){ $('#owl-carousel1').owlCarousel({

然而，您的HTML如下

<div class="owl-carousel" id="owl-carousel2">

已经看到你的错误了吗？您在HTML中引用了owl-carousel2，而您的Javascript却在寻找#owl-carousel1。如果你想改变你的Javascript或HTML，我会留给你。

owl-carousel滑块在我的Web应用程序中不起作用

1 个答案: