Прозрачный баннер или счетчик на вашем сайте, блоге

[Nikola Tesla]

Большинство активных интернетчиков  видели прозрачные баннеры и счетчики статистики на различных интернет форумах, блогах и сайтах, счетчики которые при наведении курсора мышки становились обычными:



Как сделать прозрачные баннеры и счетчики вашего сайта:
Есть много вариантов как это можно сделать, рассмотрим только два самых простых примера:

1. Открой файл стилей, style.css и добавь код:

Код: [Выделить]

#counters a img
{
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);
}

#counters a:hover img
{
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}
далее открой файл в котором прописаны счетчики (или баннеры), например index.php или index.html или page.php

и обрамляй картинки (счетчики, баннер) в теги:

Код: [Выделить]

<div id="counters">тут счетчики или баннеры</div>
2. Открой нужную страницу например index.php со счетчиками и добавь:

Код: [Выделить]

<style type="text/css">
<!--
#counters a img {
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);
}
#counters a:hover img {
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}
-->
</style>
далее найди счетчики и обрами их так же как и в первом варианте:

Код: [Выделить]

<div id="counters">тут картинки, баннеры</div>

Посмотреть как работает этот эффект можно на нашем форуме в "подвале"

[motocross]

Nikola Tesla, огроменное спасибо! 

[Nikola Tesla]

Будут вопросы - спрашивайте, постараюсь ответить. 

[motocross]

можно ли сделать через css закругленные углы у обычной ссылки,
есть ли какой-нибудь код ?
или нужно загружать специальную заранее подготовленную картинку в фон?

[Nikola Tesla]

motocross, твой вопрос не ясен  :be:

[motocross]

конкретно:
вот ссылка на главную страницу сайта, если пролистать, можно увидеть "Карту раздела Аватары". При наведении на ссылку меняется фон, но на фоне становится прямоугольник с прямыми углами, а я хотел узнать, как сделать так, чтобы на фоне углы были закруглены.
Нужно просто картинку с закругленными углами как фон использовать или есть какая-то специальная команда, закругляющая у фона углы.
В css используется параметр display: block;

[Nikola Tesla]

для wordpress лучше использовать возможности плагинов, например http://wordpress.org/extend/plugins/simple-tags/screenshots/

[motocross]

для wordpress лучше использовать возможности плагинов, например http://wordpress.org/extend/plugins/simple-tags/screenshots/

че то не соображу как это к моему вопросу относится 

[Gab0]

Вооо большое спасибо тебе

[boc161]

Создал  сайт. Объясните пожалуйста, какой счет лучше разместить на сайте? Сколько их нужно размещать – один или несколько? Будут ли они приносить пользу для оптимизации сайта? Влияет ли счет на безопасность сайта? Заранее благодарю за ответ.

[Никита]

Создал  сайт. Объясните пожалуйста, какой счет лучше разместить на сайте? Сколько их нужно размещать – один или несколько? Будут ли они приносить пользу для оптимизации сайта? Влияет ли счет на безопасность сайта? Заранее благодарю за ответ.

Я не знаю... Я накатал сам себе свой счёт, а щя сижу и радуюсь (:

[FesoN /A/]

Саня спасибо
давно искал но не мог найти

[Nikola Tesla]

Создал  сайт

Поздравляю! Если что размещайте ссылку на свой сайт в разделе оценить сайт.

какой счет лучше разместить на сайте?

Счетчики лучше всего размещать только после того, как на сайте появятся статьи (контент). Разместить желательно три счетчика с сайтов top100.rambler.ru top.mail.ru liveinternet.ru

Будут ли они приносить пользу для оптимизации сайта?

Нет. Почитайте тему оптимизация для новичков.

Влияет ли счет на безопасность сайта?

Счетчики статистики сайтов никаким образом не влияют на безопасность сайтов. Проблемы могут быть, только если все сервисы счетчиков выкупит один Мистер Зло.

[papaBIGI]

Огромное спасибо давно хотел такую фишку сделать!!!

[Никита]

Код: [Выделить]

#counters a img
{
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);
}

#counters a:hover img
{
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
-moz-transition: -moz-opacity 1s 1s ease;
-o-transition: -moz-opacity 1s 1s ease;
-webkit-transition: -moz-opacity 1s 1s ease;
-moz-transition: opacity 1s 1s ease;
-o-transition: opacity 1s 1s ease;
-webkit-transition: opacity 1s 1s ease;
}
Так красивее будет для Оперы, Лисы и Хрома