URL: https://www.opennet.me/cgi-bin/openforum/vsluhboard.cgi
Форум: vsluhforumID9
Нить номер: 8653
[ Назад ]

Исходное сообщение
"Помогите откоректировать скрипт."

Отправлено BOSS , 17-Мрт-10 19:18 
Доброго времени суток. Может я не туда размесил тему, если кто знает куда задать данный вопрос, то прошу подсказать.
Я разместил на сайте скрипт, который при наведении курсора мыши на изображение увеличивает его, а когда убираешь курсор, уменьшает. Когда я размещаю несколько изображений, то они размещаются в одну строку горизонтально, сколько позволяет страница сайта, а мне нужно разместить их вертикально в одну или две колонки. Подскажите как это сделать. Спасибо.
Скрипт который я использую:

Для того чтоб картинка увеличивалась при наведении на неё мыши надо ;
1. В 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;  
}

2. Сам код картинки должен выглядеть так
Code

<ul class="hoverbox">  
  <li>  
  <a href="#">  
  <img src="АДРЕСС КАРТИНКИ ПРЕВЬЮ" border="0" alt="ОПИСАНИЕ" />  
  <img class="preview" src="АДРЕСС ПОЛНОГО ИЗОБРАЖЕНИЯ" border="0" alt="ОПИСАНИЕ" />  
  </a>  
  </li>  
</ul>


Содержание

Сообщения в этом обсуждении
"Помогите откоректировать скрипт."
Отправлено aaa , 18-Мрт-10 05:07 
>[оверквотинг удален]
>Code
>
><ul class="hoverbox">  
>  <li>  
>  <a href="#">  
>  <img src="АДРЕСС КАРТИНКИ ПРЕВЬЮ" border="0" alt="ОПИСАНИЕ" />  
>  <img class="preview" src="АДРЕСС ПОЛНОГО ИЗОБРАЖЕНИЯ" border="0" alt="ОПИСАНИЕ" />  
>  </a>  
>  </li>  
></ul>

Попробуйте так:
<ul class="hoverbox">  
  <li>первая картинка</li>
  <li>вторая картинка</li>
  <li> и т.д.</li>
</ul>
если не помежет, то
<table>
<tr>первая картинка</tr>
<tr>вторая картинка</tr>
<tr> и т.д.</tr>
</table>


"Помогите откоректировать скрипт."
Отправлено Boss , 21-Мрт-10 00:47 
Здравствуйте! Ссылки, что указали на странице: две последние не работают, первая когда устанавливаешь возле изображения появляется много лишних знаков. Вот таких: >>>>>>>>.
Жду ответ. Спасибо.