Question

好吧，有点失去理智。在我为客户工作的网站上，我需要一些JCarousel的帮助。出于某种原因，我在上述问题上已经被困了几个小时。无论我尝试什么，我仍然有问题（虽然Carousel在页面上工作正常，一旦加载，去图！）

我已尝试过this和this以及this等建议，但没有运气，错误仍然存在。

我的代码如下所示：

<div class="Block BlockContent">

    <link rel="stylesheet" type="text/css" href="/content/PromoBannerCarousel/pbjcarousel.css">
    <script type="text/javascript" src="/content/PromoBannerCarousel/jquery.jcarousel.min.js"></script>

    <div class="jcarousel-skin-promobanner">
        <div class="jcarousel-container jcarousel-container-horizontal" style="position: relative; display: block;">
            <div class="jcarousel-clip jcarousel-clip-horizontal" style="position: relative;">
                <ul id="promobannercarousel" class="jcarousel-list jcarousel-list-horizontal" style="overflow: hidden; position: relative; top: 0px; margin: 0px; padding: 0px; top: -500px; left: 0px; height: 90px; align: center;">
                    <li>
                        <a href="https://itoutlet.com.au/free-shipping-promotion-sep-2013/">
                           <img src="/content/PromoBannerCarousel/images/augfreedeliveryselprodmini.jpg" title="Free shipping on selected products throughout our store, available from Sep 11 to Sep 30 or while stocks last"/>
                        </a>
                    </li>

                    <li>
                        <a href="https://itoutlet.com.au/acer-promotions/">
                           <img src="/content/PromoBannerCarousel/images/acercashbackmini.jpg" title="Acer fantastic Laptop & All In One + Shipping cash back offers! Limited stocks, do not miss out!"/>
                        </a>
                    </li>
                    <li>
                        <a href="https://itoutlet.com.au/hp-promotions/">
                           <img src="/content/PromoBannerCarousel/images/hpaugoffersmini.jpg" title="HP fantastic Laptop + Shipping offers! Limited stocks, do not miss out!"/>
                        </a>
                    </li>
                    <li>
                        <a href="https://itoutlet.com.au/wd-promotions/">
                           <img src="/content/PromoBannerCarousel/images/wdpetrolpromotmini.jpg" title="WD Personal Cloud + Petrol Voucher + Shipping Promotion"/>
                        </a>
                    </li>  
                    <li>
                        <a href="https://itoutlet.com.au/lenovo-promotions/">
                           <img src="/content/PromoBannerCarousel/images/lenovoaugoffersmini.jpg" title="Great ThinkPad + Shipping offers from Lenovo. Limited stocks, do not miss out!"/>
                        </a>
                    </li>
                    <li>
                        <a href="https://itoutlet.com.au/samsung-tablets/">
                            <img src="/content/PromoBannerCarousel/images/galaxyfreeshipmini.jpg" title="Thin, light, stylish, Samsung Galaxy + Shipping offers. Limited stocks, do not miss out!"/>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="/content/PromoBannerCarousel/images/5shippingmini.jpg" title="$5 shipping anywhere in Australia on selected accessories. Look out for the $5 Shipping tag!"/>
                        </a>
                    </li>

                </ul>
            </div>
            <div class="jcarousel-prev jcarousel-prev-horizontal" style="display: block;"></div>
            <div class="jcarousel-next jcarousel-next-horizontal" style="display: block;"></div>
        </div>

    </div>    

</div>
<script type="text/javascript">   
jQuery(document).ready(function() {
    jQuery('#promobannercarousel').jcarousel({
        auto: 4,
        scroll: 1,
        wrap: 'circular',
        animation: 500,
        iniFallbackDimension: 90,
        itemLoadCallback: {
            onBeforeAnimation: mycarousel_fadeOut,
            onAfterAnimation: mycarousel_fadeIn
        }
    });
    function mycarousel_fadeOut(carousel) {
        var JCcontainerID = carousel.clip.context.id;
        $('#' + JCcontainerID).fadeOut();
    }

    function mycarousel_fadeIn(carousel) {
        var JCcontainerID = carousel.clip.context.id;
        $('#' + JCcontainerID).fadeIn();
    }
});
</script>

可以找到CSS here。

这是显示问题的页面的link。 Carousel是页面顶部的促销横幅。我使用Chrome（最新版本）看到了这个问题。

任何帮助将不胜感激！

PS：我没有在FireFox（最新版本）中看到错误，所以不确定为什么它会在Chrome中出错而不是FF ......

PSS：您还会看到页面加载第一张图片时，它会在结算前闪烁几次。我从来没有在JCarousel发生过这种情况，我也尝试了几种方法来解决这个问题......如果你对此有任何建议我会非常感激!!

提前感谢您的帮助！中号

JCarousel没有为物品设置宽度/高度

0 个答案: