小编Dev*_*Joe的帖子

我想用CSS修改这个矩形div/background的底部,所以结果是这样的:

是否有人有想法如何实现？

.curved {
  margin: 0 auto;
  width: 800px;
  height: 500px;
  background: lightblue;
}

<div class="container">
  <div class="curved"></div>
</div>

我想每5秒钟摇晃一次此文本，因此我尝试在CSS中实现动画并通过jQuery设置间隔，但是似乎出了点问题……想法丢失了什么？这是一个小提琴：https : //jsfiddle.net/s909gu2s/1/

.shk {
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    -webkit-animation-name: shake;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0s;
}

@keyframes shakeMe {
    10%, 90% {
        transform: translate3d(-5px, 0, 0);
    }

    20%, 80% {
        transform: translate3d(5px, 0, 0);
    }

    30%, 50%, 70% {
        transform: translate3d(-5px, 0, 0);
    }

    40%, 60% {
        transform: translate3d(5px, 0, 0);
    }
}

$(document).ready(function() {
    setInterval(function() {
        $(".shk").css("animation", "shakeMe");
    }, 500);
});

<div class="shk">Shake me</div>

有人知道我可以访问owlCarousel 中的stagePadding 属性，所以如果窗口宽度小于x px，我可以将其设置为0 吗？所以，像这样：

function() {
    $('.owl-carousel').owlCarousel({
        margin: 10,
        loop: true,
        items: 1,
        stagePadding: 200,
        nav: true,
        dots: true,
        dotsData: true,
        navText : ["<span>?</span>","<span>?</span>"],
        dotsContainer: '.owl-dots-container'
    });

    if ( $(window).width() < 1000 ) {
        $('.owl-carousel').stagePadding = 0;
    } else {
        $('.owl-carousel').stagePadding = 200;
    }
});