Как скрыть фоновое изображение через 5 секунд только с помощью css? - PullRequest
0 голосов
/ 09 ноября 2018

Я использую значения массива, они должны отображаться в div. В этом разделе я хочу добавить фоновое изображение в span. Моя проблема в том, что я хочу скрыть фоновое изображение через 5 секунд, используя только CSS. Я использую некоторые методы, они не скрывают фоновое изображение. Это мой код,

<div id='remove_elem' data-bind='template: { foreach: showRacer }'>
    <div style="width: 50%;" data-bind='attr: { "class": "planet "}'>
        <span data-bind='attr: {"id": id }' class="downImg"></span>
        <div class="left" data-bind='text: id'></div>
        <div class="right" data-bind='text: rank'></div>
    </div>
</div>

файл сценария,

   $(document).ready(function(){ 
    var PlanetsModel = function() {
        self.Racer = ko.observableArray([
            { id: "Racer-101", rank: "5"},
            { id: "Racer-102", rank: "2"},
            { id: "Racer-103", rank: "1"},
            { id: "Racer-104", rank: "4"},
            { id: "Racer-105", rank: "7"},
            { id: "Racer-106", rank: "8"},
            { id: "Racer-107", rank: "9"},
            { id: "Racer-108", rank: "3"},
            { id: "Racer-109", rank: "6"}
        ]);

       //var newData = self.Racer();
        console.log("First array : " + JSON.stringify(self.Racer()));


        this.showRacer = ko.computed(function() {
           return self.Racer();        
        }, this);
    };
ko.applyBindings(new PlanetsModel());
});

CSS стиль,

<style>
.downImg {
        width: 10px;
        height: 14px;
        background: url(http://pariharam.info/skgmailer/down_arrow.png);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: scroll;
        -webkit-transition: background-image 0.2s ease-in-out;
        transition: background-image 0.2s ease-in-out;
    }
</style>

Это мой пример кода, они должны отображать изображение, но не скрывать изображение через 2 секунды. Как это возможно в css ..

...