Автор Тема: Прозрачный баннер или счетчик на вашем сайте, блоге  (Прочитано 6324 раз)

0 Пользователей и 1 Гость просматривают эту тему.

Оффлайн Nikola TeslaАвтор темы

  • Землянин
  • *****
  • Сообщений 6464
  • Респектов +3564
  • Репутация 1361
  • Пол: Мужской
    • Просмотр профиля
Большинство активных интернетчиков  *putercatf* видели прозрачные баннеры и счетчики статистики на различных интернет форумах, блогах и сайтах, счетчики которые при наведении курсора мышки становились обычными:



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

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>


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

Форум аватар


Оффлайн motocross

  • Местный
  • **
  • Сообщений 62
  • Респектов +17
  • Репутация 4
  • Пол: Мужской
    • Просмотр профиля
Nikola Tesla, огроменное спасибо!  *super*

Оффлайн Nikola TeslaАвтор темы

  • Землянин
  • *****
  • Сообщений 6464
  • Респектов +3564
  • Репутация 1361
  • Пол: Мужской
    • Просмотр профиля
Будут вопросы - спрашивайте, постараюсь ответить.  *coffee cup*

Оффлайн motocross

  • Местный
  • **
  • Сообщений 62
  • Респектов +17
  • Репутация 4
  • Пол: Мужской
    • Просмотр профиля
можно ли сделать через css закругленные углы у обычной ссылки,
есть ли какой-нибудь код ?
или нужно загружать специальную заранее подготовленную картинку в фон?

Оффлайн Nikola TeslaАвтор темы

  • Землянин
  • *****
  • Сообщений 6464
  • Респектов +3564
  • Репутация 1361
  • Пол: Мужской
    • Просмотр профиля
motocross, твой вопрос не ясен  :be:

Оффлайн motocross

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

Оффлайн Nikola TeslaАвтор темы

  • Землянин
  • *****
  • Сообщений 6464
  • Респектов +3564
  • Репутация 1361
  • Пол: Мужской
    • Просмотр профиля
для wordpress лучше использовать возможности плагинов, например http://wordpress.org/extend/plugins/simple-tags/screenshots/

Оффлайн motocross

  • Местный
  • **
  • Сообщений 62
  • Респектов +17
  • Репутация 4
  • Пол: Мужской
    • Просмотр профиля
для wordpress лучше использовать возможности плагинов, например http://wordpress.org/extend/plugins/simple-tags/screenshots/

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

Оффлайн Gab0

  • Новичок
  • *
  • Сообщений 15
  • Респектов 0
  • Репутация 0
  • Пол: Мужской
    • Просмотр профиля
Вооо большое спасибо тебе *victory*

Оффлайн boc161

  • Время деньги, а знания сила!
  • Старожил
  • ***
  • Сообщений 217
  • Респектов +10
  • Репутация 4
  • Пол: Мужской
    • Просмотр профиля
Создал  сайт. Объясните пожалуйста, какой счет лучше разместить на сайте? Сколько их нужно размещать – один или несколько? Будут ли они приносить пользу для оптимизации сайта? Влияет ли счет на безопасность сайта? Заранее благодарю за ответ. *scratch_one-s_head*

Оффлайн Никита

  • или Никита Романович, или
  • Продвинутый ветеран
  • *******
  • Сообщений 1320
  • Респектов +262
  • Репутация 104
  • Пол: Мужской
    • Просмотр профиля
Создал  сайт. Объясните пожалуйста, какой счет лучше разместить на сайте? Сколько их нужно размещать – один или несколько? Будут ли они приносить пользу для оптимизации сайта? Влияет ли счет на безопасность сайта? Заранее благодарю за ответ.
Я не знаю... Я накатал сам себе свой счёт, а щя сижу и радуюсь (:

Оффлайн FesoN /A/

  • Постоялец
  • ***
  • Учусь делать аватарки! Моя первая работа!

  • Сообщений 128
  • Респектов +12
  • Репутация 4
  • Пол: Мужской
    • Просмотр профиля
Саня спасибо
давно искал но не мог найти

Оффлайн Nikola TeslaАвтор темы

  • Землянин
  • *****
  • Сообщений 6464
  • Респектов +3564
  • Репутация 1361
  • Пол: Мужской
    • Просмотр профиля
Создал  сайт

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

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

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

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

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

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

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

Оффлайн papaBIGI

  • Старожил
  • ***
  • Сообщений 206
  • Респектов +8
  • Репутация 1
  • Пол: Мужской
    • Просмотр профиля
Огромное спасибо давно хотел такую фишку сделать!!! *super*

Оффлайн Никита

  • или Никита Романович, или
  • Продвинутый ветеран
  • *******
  • Сообщений 1320
  • Респектов +262
  • Репутация 104
  • Пол: Мужской
    • Просмотр профиля
#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;
}

Так красивее будет для Оперы, Лисы и Хрома *scratch_one-s_head*

 

Размещение баннеров на сайте

Автор Nikola Tesla

Ответов: 6
Просмотров: 2912
Последний ответ 19 Март 2014, 17:39:00
от Nikola Tesla