[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Увеличение картинки при наведениии на нее мышки
Cre@tivEДата: Четверг, 04.03.2010, 20:40 | Сообщение # 1
Админчик сайтика=)
Группа: Администраторы
Сообщений: 274
Репутация: 32
Статус: :-(
В css:

Code

/* =hoverbox code  
----------------------------------------------------------------------*/  

.hoverbox  
{  
   cursor: default;  
   list-style: none;  
}  

.hoverbox a  
{  
   cursor: default;  
}  

.hoverbox a .preview  
{  
   display: none;  
}  

.hoverbox a:hover .preview  
{  
   display: block;  
   position: absolute;  
   top: -33px;  
   left: -45px;  
   z-index: 1;  
}  

.hoverbox img  
{  
   background: #fff;  
   border-color: #a6dcf5;  
   border-style: solid;  
   border-width: 1px;  
   color: inherit;  
   padding: 2px;  
   vertical-align: top;  
}  

.hoverbox li  
{  
   background: #eaf8fe;  
   color: inherit;  
   display: inline;  
   float: left;  
   margin: 3px;  
   padding: 5px;  
   position: relative;  
}  

.hoverbox .preview  
{  
   border-color: #a6dcf5;  
}

Сам код будет выглядеть вот так:

Code
<ul class="hoverbox">  
   <li>  
   <a href="#">  
   <img src="адресс картинки превью" border="0" alt="описание" />  
   <img class="preview" src="адресс полного изображения" border="0" alt="описание" />  
   </a>  
   </li>  
</ul>


 
  • Страница 1 из 1
  • 1
Поиск: