猫头鹰轮播自定义缩略图背景图像在调整窗口大小时消失

Question

我为我的猫头鹰旋转木马制作了一个自定义缩略图。缩略图是猫头鹰旋转木马的分页点，我只是设置了它的样式，使其看起来像缩略图，我将图像放在缩略图中作为背景图像。我的问题是每当我调整浏览器大小时，图像都会消失。有谁知道如何解决这个问题，请帮助我，提前感谢！

这是页面 网站

这是我的Jquery代码：

$j(document).ready(function() {
    var owl;
    owl = $j("#owl-sub-categories");
    owl.owlCarousel({
  navigation : false, // don't Show next and prev buttons
  slideSpeed : 500,
  paginationSpeed : 400,
  singleItem:true,
  autoHeight : true,
  afterInit: afterOWLinit

}）;

function afterOWLinit() {
    // adding A to div.owl-page
    $j('.owl-controls .owl-page').append('<a class="item-link" href="#"/>');
    var pafinatorsLink = $j('.owl-controls .owl-page');
    /**
     * this.owl.userItems - it's your HTML <div class="item"><img src="http://www.ow...t of us"></div>
     */
    $j.each(this.owl.userItems, function (i) {
        $j(pafinatorsLink[i])
            // i - counter
            // Give some styles and set background image for pagination item
            .css({
                'background': 'url(' + $j(this).find('img').attr('src') + ') no-repeat'
            })
    });
}

$j(".owl-controls").appendTo(".sub-thumbnail-col");        

}）;

这是我的 HTML：

       <?php foreach ($categories as $categ): ?>
           <div class="item">
                <div class = "item-header">
                      <div class = "item-header-extra item_child">
                      </div>
                      <div class = "item-header-inner item_child">
                          <h1><?php echo $categ->getName()?></h1>
                      </div>
                </div>
                <div class = "item-content">
                       <div class = "sub_main_img_inner item_child">
                            <a href="<?php echo $this->getCategoryUrl($categ)?>">
                                <?php 
                                if($imgUrl = Mage::getModel('catalog/category')->load($categ->getId())->getThumbnail()):?>
                                    <img src="<?php echo $this->getBaseUrl()."media/catalog/category/".$imgUrl ?>" alt="" />
                                <?php endif; ?>
                            </a>
                       </div>
                       <div class = "sub_desc_inner item_child">
                           <?php $desc = Mage::getModel('catalog/category')->load($categ->getId())?>
                           <?php echo $desc->getFeatures();?>
                       </div>
                </div>
           </div>
       <?php endforeach; ?>

<div class = "sub-thumbnail-col col-md-1">
    <!-- This div is the container for the appended thumbnail -->
</div>

Answer 1

我怀疑在你的猫头鹰配置中输入"afterUpdate： afterOWLinit"会解决你的问题。我自己只是在做一些非常相似的事情，并在几个小时后发现，兜圈子试图解决这个问题。