GIFplayer

[jeckill 0]

del

Изменено 26 декабря 2014 пользователем jeckill

[jeckill 0]

До конца так и не мог подружиться с gifplayer )

Качаем : https://www.dropbox....fplayer.js?dl=0

Подключаем стили:

ins.play-gif{box-sizing:border-box;position:absolute;top:50%;margin-top:-20px;left:50%;margin-left:-20px;min-height:40px;min-width:40px;text-align:center;background:#222;line-height:34px;font-size:14px;text-transform:uppercase;color:#fff;border-radius:50%;opacity:.9;border:3px solid #fff;cursor:pointer;text-decoration:none}ins.play-gif:hover{opacity:.5}.gifplayer-wrapper{position:relative}a.gif-view-full{position:absolute;right:4px;z-index:99;font-weight:bold}@media(max-width :480px){a.gif-view-full{display:inline-block !important}}.spinner{height:25px;width:25px;margin:0 auto;position:absolute;top:50%;left:50%;margin-top:-19px;margin-left:-19px;-webkit-animation:rotation .6s infinite linear;-moz-animation:rotation .6s infinite linear;-o-animation:rotation .6s infinite linear;animation:rotation .6s infinite linear;border-left:6px solid rgba(256,256,256,.15);border-right:6px solid rgba(256,256,256,.15);border-bottom:6px solid rgba(256,256,256,.15);border-top:6px solid rgba(256,256,256,.8);border-radius:100%}@-webkit-keyframes rotation{from{-webkit-transform:rotate(0)}to{-webkit-transform:rotate(359deg)}}@-moz-keyframes rotation{from{-moz-transform:rotate(0)}to{-moz-transform:rotate(359deg)}}@-o-keyframes rotation{from{-o-transform:rotate(0)}to{-o-transform:rotate(359deg)}}@keyframes rotation{from{transform:rotate(0)}to{transform:rotate(359deg)}}.icon-maximize:before{;content:"\f0b2"}

Инициализируем:

<script>

	$(function() {


	$('.gifs').gifplayer();


	});

</script>

Добавляем в новость картинку

<img class="gifs" data-gif="http://img-9gag-ftw.9cache.com/photo/aRg9pjy_460sa.gif" src="http://img-9gag-ftw.9cache.com/photo/aRg9pjy_460s.jpg" alt="" border="0" style="letter-spacing: 0px; line-height: 1.5em; word-spacing: 0.1em; margin: 0px; float: none; width: 618px;" title="" />

Проблемы - tinymce урезает

data-gif="http://img-9gag-ftw.9cache.com/photo/aRg9pjy_460sa.gif"

Собественно результат http://http://shtoes...mnyh-kolec.html

Изменено 2 января 2015 пользователем jeckill