Блоки, меняющие прозрачность при наведении курсора

LetItBit.net - Заработок для вебмастера

Этот скрипт создаст на выбранных вами блоках сайта эффект прозрачности, степень которыой будет плавно меняться при наведении курсора на блок. В качастве блока может выступать любой элемент страницы, будь то DIV, рисунок, информер, баннер, ссылка...

Эффект меняющейся прозрачности создается скриптом, найденным по частям в сети, собранным и исправленным нашими программистами. Скрипт прост в использовании. Для Вас не составит труда установить его на Ваш сайт и настроить.

Итак, установка. Впишите в коде, желательно в теле HEAD, следующую строку:

Code
<script type="text/javascript" src="http://szenprogs.ru/scripts/FadeBlock.js"></script>

Этой строкой мы подключили модуль, который и управляет эффектом. Если желаете, можете скопировать этот модуль на свой хост. В этом случае, в строке, описанной выше, замените адрес на свой.

После этого нужно прописать код вызова функции, которая назначит прозрачность и эффект ее изменения к обработчику событий нужных блоков. Код выглядит так:

Code
<script type="text/javascript"><!--
  FadeInit(['fBlock'],0,0.4,0.1);
--></script>

Внимание! Код вызова нужно прописать в конце страницы (перед тегом BODY). В крайнем случае, после блоков, на которые эффект нужно повесить. Это нужно для того, чтобы функция смогла назначить события на блоки. А блоки эти должны быть уже созданы до выполнения функции.

Параметры функции:

  • Первый параметр - список классов блоков, на которые эффект должен распространяться. Например, если класс блоков cl1 и cl2, то в параметр нужно вписать: ['cl1','cl2'].
  • Второй параметр - направление эффекта. 0 - стандартное положение прозрачный, а при наведении курсора непрозрачный. 1 - стандартное положение непрозрачный, а при наведении курсора прозрачный.
  • Третий параметр - уровень прозрачности. Значение от 0 (полная прозрачность) до 1 (полная непрозрачность).
  • Четвертый параметр - скорость эффекта. Значение от 1 (эффект не происходит) до значение больше нуля. Нулевое значение устанавливать нельзя. Это придаст эффекту бесконечность и зацикливание.

Все, устанавливаете код на свою страницу, настраиваете, как Вам надо, и используете.

Удачи вам!

rss



Здесь может быть ваша реклама!
Площадка №2. Стоимость 700 рублей в месяц.

Предложения отправлять через эту форму.

Категория:Скрипты
Просмотрено:3351
Рейтинг:4.2/16
Дата добавления:07.08.2009 14:22, Пятница
Добавил:Szen
Теги:Блок, JavaScript, полупрозрачный

Мини-форум

1 2 »
№ 0Пятница, 07.08.2009 14:22
Szen
Аватар участника Szen
Здесь вы можете задать вопрос или оставить комментарий по теме "Блоки, меняющие прозрачность при наведении курсора".
Профиль
№ 1Понедельник, 28.09.2009 19:41
bigben
Аватар участника bigben
Вставляем это в самый низ в CSS шаблоне:
Code
/* ----////// Эффект прозрачности /////------- */

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

#banners a:hover img {
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}

Теперь заключаем счётчик или любое изображение в код:

Code
<div id="banners">Тут ваши счётчики, кликабельные картинки</div>
cool
ПрофильWWW
№ 2Понедельник, 28.09.2009 19:50
Szen
Аватар участника Szen
bigben, ваш метод не обеспечивает плавное изменение прозрачности. А для резкого изменения - в самый раз.
ПрофильWWW
№ 3Вторник, 01.12.2009 17:37
wangog
Аватар участника wangog
Вот и нашёл то что искал ! Автору СПАСИБА !
ПрофильWWW
№ 4Вторник, 15.12.2009 19:52
Gambit
Аватар участника Gambit
Szen, опять обращаюсь за помощью..)
поставил скрипт..
а именно создал эффект для копирайта Ucoz..
(на сайте у меня снизу слева..)
работает отлично, но на таких страницах как например "форум" или "FAQ" копирайт отображается без эффекта прозрачности..
на страницах созданных мною все нормально..
ПрофильWWW
№ 5Вторник, 15.12.2009 20:03
Szen
Аватар участника Szen
Gambit, вы на форуме не подключили предлагаемый скрипт. В FAQ скрипт тоже отсутствует.
Скрипт нужно подключать на всех страницах, на которых он должен работать.
ПрофильWWW
№ 6Воскресенье, 20.12.2009 21:55
Клаус
Аватар участника Клаус
Замечательный скрипт, спс автору !
ПрофильWWW
№ 7Воскресенье, 03.01.2010 22:02
danila00
Аватар участника danila00
Спасибо автору! Подскажите, назначаю стандартное положение непрозрачное, в эксплорере прозрачным не становится. В опере и хроме работает.
Профиль
№ 8Понедельник, 04.01.2010 17:36
Szen
Аватар участника Szen
danila00, в IE до версии 6 включительно есть такой баг. Он не исправляется. В ближайшем будущем будет сделан скрипт, который будет работать независимо от браузера. Чуть подождите. smile
ПрофильWWW
№ 9Суббота, 13.03.2010 15:11
kick
Аватар участника kick
Чет никак не могу сообразить как он прикрепляется? Нужно класс прописывать или как? Можно на одном примере хотя бы посмотреть,а то я что-то ничего из кода вашей страницы не понял)))
Профиль
№ 10Суббота, 13.03.2010 16:55
kick
Аватар участника kick
Тоесть вот этого будет достаточно?
<p style="opacity: 0.4;" class="fBlock">......</p>
А если я сам скрипт пропишу в страницах сайта, а вышеуказанную строчку буду прописывать в глобальном блоке скрипт будет работать?
Профиль
1 2 »
Учавствовать в обсуждении "Блоки, меняющие прозрачность при наведении курсора" могут только зарегистрированные пользователи.

Внимание

Все скрипты, инструкции, тесты, статьи и подборки, опубликованные в блоге портала, являются собственностью портала. Администрация портала не несет никакой ответственности за содержания статей и скриптов, но обязуется не публиковать материалы, нарушающие законодательство Российской Федерации, порнографию, инструкции по взлому и вскрытию. Администрация портала сама решает, кому помогать в решении какой-либо проблемы, а кому отказать в помощи. Цитируя наш текст и устанавливая опубликованные скрипты, вы соглашаетесь с тем, что используете продукт, созданный или подготовленный порталом SzenProgs. Портал SzenProgs оставляет за собой право менять инструкции, тесты, записи, подборки и скрипты по своему усмотрению и менять содержимое файлов, залитых на портале.

Любая, полная или частичная, публикация материала, размещенного в блоге портала SzenProgs, на другом стороннем от портала SzenProgs сайте должна сопровождаться ссылкой на источник.

Здесь может быть ваша реклама!
Площадка №3. Стоимость 500 рублей в месяц.

Предложения отправлять через эту форму.

Реклама
Ролевая бесплатная онлайн игра Carnage
Копилка
Прием пожертвований и благодарности
(SMS):


Копилка

(WebMoney):


День рождения
Поздравляем с днем рождения следующих друзей:
Kimblejcjqzz(40), denisbardas(15), stisurneybrit(49), faremiamume(46), NiteNearianep(40), Dik0n(24).
Желаем им счастья, здоровья, благополучия, любви и богатства!

С уважением, администрация сайта.
Holiday
Посетители
Статистика
Valid HTML 4.01 Transitional

Яндекс цитирования
Качество сайта...
Rambler's Top100
Business Key Top Sites




Каталог-Молдова - Ranker, Statistics



Онлайн всего: 25
Гостей: 25
Пользователей: 0
Кнопка портала
RSS лента Блога
RSS лента Каталога файлов
RSS лента Новостей
Личный блок
  • Гость портала.
  • Личных данных нет.
Вход на сайт
Регистрация
Софт
Заработок
Опрос
Сколько сайтов у вас есть?
Всего ответов: 818
Друзья портала
Вы тоже можете разместить здесь свою ссылку:


Скачать программы для Windows

Many-FileS.RU - Скачать бесплатно музыку, фильмы, софт, книги без регистрации!

Работа в интернете
© 2009, SzenProgs
Администратор и дизайнер портала: Szen
Хостинг от uCoz