Как разместить на постере качество видео?

голоса: 0

  Как реализовать такое?, подскажите пожалуйста. На каждом постере фильма отображается его качество.

| Автор: | Категория: Дизайн сайта

Ответов: 1

голоса: 0
 
Лучший ответ

В настройках модуля подключите одно из доп полей - http://joxi.ru/82QBVkgC1X5d5A после при добавлении материалов заполняйте его и пишите там какого качества видео, после (в шаблоне вида материалов) заверните в код который выводит фото материала (в такой код):

<div class="quality">здесь код который выводит фото к фильму</div>

далее там же в шаблоне вида материалов в самый низ прописать стили:

<style>
.quality:after {
 position: absolute;
 z-index: 5;
 display: block;
 content: "<?if($OTHER1$)?>$OTHER1$<?endif?>";
 left: -22px;
 top: -9px;
 padding: 20px 0 0 0;
 width: 60px;
 font: 12px/16px 'Open Sans';
 color: #fff;
 text-align: center;
 background: #FF8F00;
 -webkit-transform: rotate(-45deg);
 -ms-transform: rotate(-45deg);
 transform: rotate(-45deg);
}
</style>

в зависимости от подключенного поля $OTHER1$ меняйте порядковый номер (выделил красным) если вы первое уже используете.

| Автор:
Выбор ответа лучшим | | Автор: Руслан4
Спасибо! А если на моем сайте постер к фильму выводится через файловый менеджер ссылкой, то как быть?
Руслан4,
ссылку на сайт уточните
Руслан4,

В общем, стили выше заменить на:

<style>
 .quality:after {
 position:absolute;
 margin-left: -74px;
 z-index: 5;
 content: "<?if($OTHER1$)?>$OTHER1$<?endif?>";
 padding: 5px;
 width: 60px;
 font: 12px/16px 'Open Sans';
 color: #fff;
 text-align: center;
 background: #FF8F00;
}
</style>

и там же в шаблоне вида материалов в самый низ прописать скрипт:

<script type="text/javascript">
$(".eMessage img:nth-child(1)").each(function(index, element) {
$(element).wrap("<div class='quality'></div>");
});
</script>

стили под себя можете изменить как вам нужно, получится как-то так http://joxi.ru/82QBVkgC1X5b6A

Большое спасибо!
...