Question

我有div人可以导入照片（如封面）。虽然他们没有上传任何照片但它有封面图片，但当他们上传照片时，背景会变为白色。（这就是我想要的工作方式，但它不起作用）

这个例子正在运作：

   $(document).ready(function () {
                if ('#bgbg:not(:empty)') {
                    $('#bgbg').css({ 'background-color':'#fff',
                        'background-image':'none !important' });

                }
            });

.profile-photo-bg {
    background-image:url("../images/cover-placeholder.jpg");
    background-size:cover;

    height:245px;
   overflow:hidden;
}

<div  class="profile-photo-bg no-padding col-lg-12 col-md-12 col-xs-12 col-sm-12">
                    <div id="bgbg" class="profile-photo-bg2">

                    <div ng-repeat="image in theUser.attributes.ImageGallery " class=" galleryImage2 " style="background:url({{image._url}}) 50% 50% / cover; ">
                        <i class='ion-close' ng-click='deleteFromGallery(image)'></i></div>

                    </div>

                </div>

现在我有a的不同代码，里面没有使用相同的jquery脚本：

<div  id="bgbg3" class="profile-photo-bg no-padding col-lg-12 col-md-12 col-xs-12 col-sm-12">
                   <a style="" class="fotki" ng-repeat="image in theUser.attributes.ImageGallery" href="{{image._url}}" data-lightbox="gallery">
                       <div ng-if='$index < 5' class="galleryImage2 " style="background-image:url({{image._url}}); background-size: cover; "></div>
                   </a>
               </div>

我使用angularjs，jquery，ionic。

我怎样才能让它发挥作用？

Answer 1

您的JavaScript语法中有错误。您应该在$('#bgbg')语句中选择if之类的元素。此外，您应该检查div是否在if语句中包含子项而不是使用选择器。在div中添加一个类也比使用jQuery应用纯css更好。

JavaScript：

$(document).ready(function () {
    $('.bgbg').each(function() {
        if ($(this).children().length == 0) {
            $(this).addClass('no-children');
        }
    })
});

CSS：

.bgbg {
    background-image:url("http://www.gigcity.ca/wp-content/uploads/2017/06/Tool-feature.jpg");
    background-size:cover;
    height:245px;
    overflow:hidden;
}
.bgbg.no-children {
    background-image: none !important;
    background-color: white;
}

HTML：

<div  class="profile-photo-bg no-padding col-lg-12 col-md-12 col-xs-12 col-sm-12">
  <div class="profile-photo-bg2 bgbg">
    <div ng-repeat="image in theUser.attributes.ImageGallery " class=" galleryImage2 " style="background:url({{image._url}}) 50% 50% / cover; ">
      <i class='ion-close' ng-click='deleteFromGallery(image)'></i>
    </div>
  </div>
</div>

<div class="profile-photo-bg no-padding col-lg-12 col-md-12 col-xs-12 col-sm-12">
  <div class="profile-photo-bg2 bgbg">
  </div>
</div>

这是一个工作小提琴：Remarks

如何根据里面的div改变div的风格？

1 个答案: