Ovaj Jquery će me izludeti toliko da ću morati da sednem i da ga proučim dobro, ali za sada, da li neko ima ideju zašto dolazi do sledećeg problema:
Koristim wow.js i animations.css kombinaciju.
Kod koji je ispod ispisan (bootstrap) trebalo bi da sadrži blok širine 1/4 ekrana na normalnom desktopu u njemu je slika, naslov i tekst. E taj blok ne treba da se vidi u startu, a prilikom skrolovanja do njega treba da se pojavi uz fadeIn efekat.
Sve to radi, ali on se iz "ništavila" prvo pojavi na blic u punoj veličini i boji a onda nestane pa se pojavi uz fadeIn efekat.
<div class="col-xs-12 col-sm-6 col-md-3" style="padding-top: 20px; padding-bottom: 20px;">
<div class="wow fadeIn rblok" data-wow-duration="2s" data-wow-delay="0.2s" aria-hidden="true">
<img class="img-thumbnail img-responsive center-block" src="images/slika1.jpg" alt="slika1" style="width: 100%;"/>
<span class="slNaslov">Prva slika</span>
<span class="slTekst">Tekst ispod slike</span>
</div>
</div>
u css-u je za klasu rblok zadato:
.rblok {
display: none;
}
i postoji kod koji brine o skrolu:
<script>
...
var rblok_distance = $('.rblok').offset().top;
$(window).scroll(function() {
// reklamni blokovi
if ($(this).scrollTop() > rblok_distance ) {
$('.rblok').fadeIn();
}
});
...
</script>
Kako se otarasiti to pojavljivanja celog bloka u startu, glupo izgleda tako?