Свойство src, это шлюз для загрузки изображения, в который можно предварительно загрузить анимацию. То-есть "темным лесом base64" можно и не оперировать.
Если не разбираетесь в скриптах, то выложили бы тот, что создается с анимацией. Иначе монолог о трудной жизни получается. |
Вот простой пример гиф , я его вставляю на сайт но он должен начать проигрывать при прокрутке страницы те когда зона с этим гиф появиться на экране
|
Что то я не вижу вложения как прикрепить гиф
|
laimas,
прикрепляю файл а его не видно.. будем проще любая гиф анимация которая будет вставлена в сайт должна запускаться при появлении места где она расположена в видимую зону экрана |
laimas,
пример сайта http://cimes.ru/ |
Зачем мне ваша анимация, я и сам могу любую нарисовать. )
Я говорил о скрипте, который вы упоминали. То что по ссылке, это не нажать кнопку Play, и мультик начнется, это можно, к примеру элемент DIV показывать/скрывать по условию. А вот в стилях этого DIV можно задать фоновое изображение, которым и будет ваша анимация. Хотите конкретно привязать к своему сайту и условиям, в разделе работа можно это сделать. Иначе выкладывайте что есть и чего надо. |
Запуск gif при видимости на экране
6323705,
:)
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/dirkgroenen/jQuery-viewport-checker/1.7.4/src/jquery.viewportchecker.js"></script>
<script>
jQuery(document).ready(function() {
jQuery('.chart2 img').viewportChecker({
classToAdd: 'animated fadeIn',
offset: 100,
repeat: true,
callbackFunction: function(elem, action) {
elem[0].src = action == 'add' ? 'http://fufel.info/uploads/posts/2014-04/1396388286_gifs_020.gif' : '';
}
});
})
</script>
<style type='text/css'>
.chart2 img{
height: 200px;
}
</style>
</head>
<body>
<div class="chart2 animated" id="chartContainerPie2" style="margin-top:1200px;height: 300px; float: left;width: 60%;">
<img src="" alt=""></div>
</body>
</html>
|
рони,
Спасибо но у меня в окне не появляется ни чего ... если можно поподробнее куда в скрипте что подставлять |
6323705,
скролинг вниз страницы и наберитесь терпения может появится или почитайте про прелоад изображений |
рони,
Много прочитал про прелоад так и не понял Например у меня есть 5 картинок при открытии страницы они не видны на экране они стоят ниже. При прокрутке экрана появляются места где они стоят и они начинают воспроизводиться при перелистывании экрана в начальное положение они опять замолкают а при прокручивании на них опять играют. те прелоад можно применить но это не совсем то Кто приведет код чтоб это работало я не программист мне бы на обычном русском языке на сервере картинки будут находится в папке wpimages к примеру под номерами 1.gif 2.gif 3.gif 4.gif 5.gif |
| Часовой пояс GMT +3, время: 07:37. |