MegaWeb.su как создать свой сайт через html

Применяем плавное изменение прозрачности любого элемента на jQuery при наведении
Плавная jQuery прозрачность любого элемента всё очень просто и эффектно.
Представляю вашему вниманию самый простой способ плавного изменения прозрачности любого элемента без использования CSS, чисто на jQuery.
Прозрачность можно задать любому элементу на странице, достаточно просто ему прописать нужный class.
Реализация:

Если ещё не подключена - то, в шапку сайта, подключаем библиотеку jQuery с серверов yandex:

<script type="text/javascript" src="http://yandex.st/jquery/1.4.2/jquery.min.js"></script>

Туда же(в шапку) подключаем скрипт управления прозрачностью:

<script type="text/javascript">
//jQuery прозрачность любого элемента от http://megaweb.su/
$(document).ready(function(){
$('.megaweb').each(function(){
      $(this).animate({opacity:'0.3'},1);
      $(this).mouseover(function(){
          $(this).stop().animate({opacity:'1.0'},600);
      });
      $(this).mouseout(function(){
          $(this).stop().animate({opacity:'0.3'},300);
      });
});
});
</script>

Где $('.megaweb') - класс, к которому будет применена прозрачность
.animate({opacity:'0.3'},1); - начальная прозрачность элемента
.animate({opacity:'1.0'},600); - прозрачность элемента при наведении курсора мыши
.animate({opacity:'0.3'},300); - элемент возвращается к начальной прозрачности когда курсор уходит с элемента

Теперь достаточно прописать class="megaweb" любому нужному элементу, примерно так:

<h1 class="megaweb">MegaWeb.su</h1>

или

<img class="megaweb" src="megaweb.png" width="600" height="140" alt="megaweb.su - уютный уголок для web-мастера" />

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

Вот и всё!

Посмотреть пример плавное изменение прозрачности любого элемента на jQuery

Пользуйтесь на здоровье! Не забываем комментировать и добавлять новость в закладки.