Вопросы Теги

Нужно, чтобы div-ы давили, используя только CSS

Документация предполагает, что $near сортирует результаты от ближайшего к самому дальнему. Следовательно, вы можете сделать следующее на сервере (при публикации) или клиенте (если у вас уже есть все записи): 

Template.main.posts = function () {
    var totalRecords = Post.find().count();
    return Post.find({
            loc : {
                $near : {
                    $geometry : { 
                        type : "Point",
                        coordinates: [ userLocLong, userLocLat ] 
                    } 
                } 
            } 
        }, { 
            limit: 100  // Return only the nearest 100 results
        }
    );
};

Примечание от OP:

Код действительно работает. Просто выяснили, что вам нужно добавить координаты в этом формате в коллекцию posts: 

Post.insert({

        loc: {
                  type: "Point",
                  coordinates: [foo, bar],
             }
    });
-2
задан dgknca 16 January 2019 в 19:16
поделиться

1 ответ

Я сделал снова:) 

body {
  background-color: #ddd;
  padding: 1em;
}
.cardWrap {
  display:flex;
  flex-direction:column-reverse;
}
.card { 
  background:#fff; 
  animation: slide 0.5s linear both;
  margin-bottom: 0;
  opacity: 0;
  padding:0;
  height:0px;
  width:0px;
  
}

.card:nth-child(1) {
  animation: card1 .3s forwards .5s;
}

.card:nth-child(2) {
  animation: card1 .3s forwards 1.5s;
}

.card:nth-child(3) {
  animation: card1 .3s forwards 2.5s;
}

.card:nth-child(4) {
  animation: card1 .3s forwards 3.5s;
}

.card:nth-child(5) {
  animation: card1 .3s forwards 4.5s;
}

.card:nth-child(6) {
  animation: card1 .3s forwards 5.5s;
}

.card:nth-child(7) {
  animation: card1 .3s forwards 6.5s;
}

.card:nth-child(8) {
  animation: card1 .3s forwards 7.5s;
}

.card:nth-child(9) {
  animation: card1 .3s forwards 8.5s;
}

.card:nth-child(10) {
  animation: card1 .3s forwards 9.5s;
}

.card:nth-child(11) {
  animation: card1 .3s forwards 10.5s;
}


@keyframes card1{
  to{opacity:1;height:auto;width:auto;padding:5px;margin-bottom: 1em;}
}
<div class="cardWrap">
  <div class="card">pushed DOWN</div>
  <div class="card">10 - Itin</div>
  <div class="card">9 - Itin</div>
  <div class="card">8 - Itin</div>
  <div class="card">7 - Itin</div>
  <div class="card">6 - Itin</div>
   <div class="card">5 - Itin</div>
  <div class="card">4 - Itin</div>
  <div class="card">3 - Itin</div>
  <div class="card">2 - Itin</div>
  <div class="card">1 - Itin</div>
</div>

0
ответ дан dgknca 16 January 2019 в 19:16
поделиться