插件carouFredSel没有工作我

时间:2013-08-24 20:07:47

标签: jquery caroufredsel

如果我在单个页面中使用此插件,则可以解决此问题,例如将其作为wordpress用于模板并使用enqueve

在第一时间我得到了作品,但只在firefox中,之后我尝试在其他导航器中工作,没有作品永远不会,只适用于firefox

当我开始工作时,我这样做,我使用短代码显示此滑块,带有图像,并在短代码中使用jquery核心refence以及插件src引用,这样工作,但如果代码在wordpress的头部没有作用,如果使用短代码内的代码,这将停止我所有的wordpress脚本并且只能运行这个插件,如果jquery的参考代码和引用这个插件进入头部内部永远不会工作但是我的所有插件< / p>

这个插件只有问题并且总是给我同样的问题,我的代码是这样的:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=3.5.2'"></script>
<script src="container/themes/thefactoyweb/js/jquery.carouFredSel-6.2.1.js"></script>

<style>

#footxxx img
{
    width:280px;
    height:113px;   
}

</style>

    <div id="footxxx">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
        <img src="image1.png" class="image_car" height="113" width="280">
    </div>


<script>

    jQuery(document).ready(function() {

        jQuery("#footxxx").carouFredSel({
            items: 3,
            direction: "left",
            scroll:{
                items: 2,
             // width   : 280,
             // height  : 140,
                easing:"elastic",
                duration:1000,                          
                pauseOnHove:true
            }                   
        }); 
    });

</script>

通过这个我想知道是否存在一些替代这个插件,因为它不可行的工作正常,当修复一个问题显示其他问题并继续所有时间与更多的问题

谢谢,问候!

1 个答案:

答案 0 :(得分:1)

您需要进行一些更改。

关闭图片标签

<div id="footxxx">
<img src="http://lorempixel.com/113/280/" class="image_car" height="113" width="280" />
<img src="http://lorempixel.com/113/280/" class="image_car" height="113" width="280" />
<img src="http://lorempixel.com/113/280/" class="image_car" height="113" width="280" />
<img src="http://lorempixel.com/113/280/" class="image_car" height="113" width="280" />
<img src="http://lorempixel.com/113/280/" class="image_car" height="113" width="280" />
<img src="http://lorempixel.com/113/280/" class="image_car" height="113" width="280" />
<img src="http://lorempixel.com/113/280/" class="image_car" height="113" width="280" />
</div>

更正jquery调用

$(document).ready(function() {
        $("#footxxx").carouFredSel({
            items: 3,
            direction: "left",
            scroll:{
                items: 2,
             // width   : 280,
             // height  : 140,
                easing:"elastic",
                duration:1000,                          
                pauseOnHove:true
            }                   
        }); 
    });

正确的CSS浮动

#footxxx img
 {
   width:280px;
   height:113px;   
   float:left;
}

<强> Working demo