Примеры гнезд для рекламы
Вставка движущийся рекламной строки вверх страницы.
Вариантов много, как можно вставить рекламную строку вверху страницы.
Я предлагаю вариант, когда строка не сдвигает другие элементы страницы,
а использует их как фон для себя. Движется на слое ближе к вам, чем
основные элементы страницы.
Строчный тег div с помощью стилей становится блочным и мы ему задаем ширину,
высоту и фиксированную позицию на более высоком слое.
Для движение используется специальный тег marquee. Атрибуты этого тега задают:
тип движение, направление и скорость. А в тело тега помещается фрейм.
Вставка внизу страницы аналогично.
// HTML
<div style="display: block; width: 1200px; height: 40px; position: fixed;
z-index: 2; top: 6px; left: 250px ;">
<marquee behavior=scroll direction=left scrollamount="5" width="1200px" height="40px">
<iframe></iframe></marquee></div>
Другие способы вставки рекламной строки.
Можно создать список рекламных строк. Вставьте фреймы строк в тела тегов li.
В стилях свойство display: block; требуются для отступов, ширины и высоты.
И все это в одном из родительских тегов ul или ol.
Фон можно задать как строке списка, так и самому списку. А можно задать списку один фон,
а для строк находящихся в нем другой.
// HTML
<ul style="display: block; width: 350px; min-height: 40px; position: fixed; z-index: 2; bottom: 50px; right: 20px ;">
<li style="display: block; list-style-type: none; margin: 5px auto; width: 350px; height: 30px;"><iframe></iframe></li><br />
<li style="display: block; list-style-type: none; margin: 5px auto; width: 350px; height: 30px;"><iframe></iframe></li><br />
<li style="display: block; list-style-type: none; margin: 5px auto; width: 350px; height: 30px;"><iframe></iframe></li><br />
<li style="display: block; list-style-type: none; margin: 5px auto; width: 350px; height: 30px;"><iframe></iframe></li>
и.т.д.
</ul>
Вариант когда рекламная строка вставлена в текст контента, требует совпадение темы
текста с самой рекламной строкой. Все просто!
Вставка рекламного баннера в центре страницы.
Строковый тег div, лучше других подходит для этой цели. Все что требуется,
это задать свойство в стилях: text-align: center; и отступ от соседних тегов сверху и снизу,
с помощью свойства margin-top: 30px; и margin-bottom: 30px;.
Под собой сдвигает вниз основные элементы страницы или данного блока, где вставлен.
// HTML
<div style="text-align: center; margin-top: 30px; margin-bottom: 30px;">
<iframe></iframe>
</div>
Вставка рекламного баннера в любое фиксированное место на странице кроме ее центра.
Строчный тег div с помощью стилей становится блочным и мы ему задаем ширину,
высоту и фиксированную позицию на более высоком слое. Этот тег div может быть
зафиксирован где угодно, кроме центра страницы. Потому как мониторы имеют разную ширину
Данный способ фиксирует баннер относительно сторон страницы, точным значением в пикселях
или в процентах относительно всей высоты и ширины страницы. Наш вариант фиксирован в
пикселях относительно нижней и левой сторон.
В этом примере имеется ссылка - крестик для удаления со страницы фрейма и самого крестика.
Так как он находится том-же теге div. Крестик не накладывается на баннер, а стоит рядом.
// HTML
<div id="rekl_polub" style="display: block; width: 234px; height: 60px; position: fixed; z-index: 2;
bottom: 20px; left: 20px;"><a style="display: block; width: 8px; height: 8px; position: fixed;
z-index: 100; bottom: 80px; left: 268px;" href="#" onclick="zakr_polub();">
<img alt="закрыть" title="Закрыть баннер" src="/images/close.png"></a>
<iframe></iframe>
</div>
<script>
function zakr_polub() {
document.getElementById('rekl_polub').style.display = 'none';
return;
}
</script>
Посмотрите работу скрипта в демо версии.
Демо версия скрипта здесь!
администратор:
логин - demoadmin
пароль - password
клиент:
логин - demouser
пароль - demopass
Техническая характеристика |
Описание админ-панели |
Примеры гнезд для рекламных фреймов |
Ваше мнение или вопрос
Если нашу ссылку вставите себе на сайт по адресу написанному вами в
комментарии, то ваш адрес тоже станет ссылкой!
