0

как я могу вставить затухающую анимацию?

init().fadeIn('medium') показала ошибку. Помоги пожалуйста. спасибо

function init() {
  var imgDefer = document.getElementsByTagName('img');
  for (var i = 0; i < imgDefer.length; i++) {
    if (imgDefer[i].getAttribute('data-src')) {
      imgDefer[i].setAttribute('src', imgDefer[i].getAttribute('data-src'));
    }
  }
}
window.onload = init().fadeIn('medium');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="http://soilsandstructures.com/wp-content/uploads/2017/04/no-image-icon.png" data-src="/images/1.png" style="width: 400px; height: 400px; border: 1px solid grey; margin: 20px;">
<img src="http://soilsandstructures.com/wp-content/uploads/2017/04/no-image-icon.png" data-src="/images/2.png" style="width: 400px; height: 400px; border: 1px solid grey; margin: 20px;">
<img src="http://soilsandstructures.com/wp-content/uploads/2017/04/no-image-icon.png" data-src="/images/3.png" style="width: 400px; height: 400px; border: 1px solid grey; margin: 20px;">
<img src="http://soilsandstructures.com/wp-content/uploads/2017/04/no-image-icon.png" data-src="/images/4.png" style="width: 400px; height: 400px; border: 1px solid grey; margin: 20px;">
<img src="http://soilsandstructures.com/wp-content/uploads/2017/04/no-image-icon.png" data-src="/images/5.png" style="width: 400px; height: 400px; border: 1px solid grey; margin: 20px;">

0

1 ответ 1

1

Вот этот код выполнит то, что вы хотели сделать:

js:
$(document).ready(function(){
    var imgDefer = document.querySelectorAll('img');
    [].forEach.call(imgDefer, function(imageElement){
       if (imageElement.dataset.src){
           imageElement.setAttribute('src', imageElement.dataset.src)
       }

       $(imageElement).fadeIn(500)

    })

})

Чтобы картинки изначально не показывались, нужно добавить следующие стили:

css:
img{
   display: none;
}
4
  • effekt ne viden. fse kak ranwe 23 ноя 2017 в 12:36
  • @CabrailKerimov, ошибка какая-нибудь есть? 23 ноя 2017 в 13:04
  • net. owibok net. tolka kartinki plavno ne pokazivaetsya. oni rezko pokazivaetsya kak ranwe 24 ноя 2017 в 5:07
  • 1
    @CabrailKerimov, Исправил. Только сделай одолжение: никогда больше не пиши транслитом на ru.stackoverflow.com 24 ноя 2017 в 5:20

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.