Всплывающее окно

Автор Xvost, 04 августа 2013, 18:37:17

« назад - далее »

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

Xvost

Задумал сделать для своего сайте свою небольшую фотогалерейку. Выглядит так: http://www.postvorskla.org.ua/index.php?page=privatgallery

Проблема со всплывающими окнами, с содержимым. В коде описание для разных фото разное, а при клике на "Подробнее..." вылазит одно и то же. Как правильно настроить?

<style type="text/css">
   .b, .bAndf {
        width: 180px;
        height: 165px;
border-radius: 5px;
border: 2px solid #788A9E;
padding: 4px; 4px;
float: left;
margin-right: 6px;
margin-bottom: 6px;
   }
   .f, .bAndf {
       text-align: center
   }
      #roditelskoe_okno {
        opacity: 1;
        width: 100%;
        height: 100%;
        display: none;
        left: 0;
        top: 0;
        position: fixed;
        z-index: 100;
      }
      #okno {
        width: 560px;
        background-clip: padding-box;
        background-color: #F5F5F0;
        box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
        border-radius: 6px;
        border: 1px solid rgba(0, 0, 0, 0.3);
        left: 50%;
        top: 30%;
        margin-left: -280px;
        position: fixed;
        outline: medium none;
        z-index: 1050;
      }
      .telo-okna {
        position: relative;
        overflow-y: auto;
        padding: 15px;
        max-height: 400px;
      }
  </style>

      <script type="text/javascript">
      function vsplivauchii_block(pokazat) {
        document.getElementById('roditelskoe_okno').style.display = pokazat;
      }
      </script>

  <div class="bAndf">
<a target="_blank" href="https://www.simplemachines.ru/radikal/000/fp/a1d2a964a02e47cd93b5d3fa439e27d1"><img src="https://www.simplemachines.ru/radikal/s018/i504/1308/4b/182b96321abbt.jpg" ></a>
<b>ЭР2Т-2202</b><br>
    <a href="#1" onclick="vsplivauchii_block('block'); return false"><font size="1">Подробнее...</font></a>
    <div id="roditelskoe_okno">
      <div id="okno">
        <div class="telo-okna">
          <p>Украина, Донецкая область, станция Книничная ДОН ж.д., 23.10.2011 г.<br>
Следует п. 6283 Никитовка - Криничная - Иловайск.</p>
          <a href="#" onclick="vsplivauchii_block('none'); return false">Закрыть</a>
        </div>
      </div>
    </div>
  </div>

  <div class="bAndf">
  <a target="_blank" href="https://www.simplemachines.ru/radikal/000/fp/ea6dec3e11eb486da32df1e0254b664b" ><img src="https://www.simplemachines.ru/radikal/s020/i708/1308/0d/118081720894t.jpg" ></a>
<b>ЭПЛ2Т-010</b><br>
    <a href="#2" onclick="vsplivauchii_block('block'); return false"><font size="1">Подробнее...</font></a>
    <div id="roditelskoe_okno">
      <div id="okno">
        <div class="telo-okna">
          <p>Украина, Донецкая область, станция Красный Лиман ДОН ж.д.,  02.08.2013 г.</p>
          <a href="#" onclick="vsplivauchii_block('none'); return false">Закрыть</a>
        </div>
      </div>
    </div>
  </div>

Фисташка

id картинки не передаётся, открывается первое попавшееся.

<p>Украина, Донецкая область, станция Книничная ДОН ж.д., 23.10.2011 г.<br>

Xvost

а как исправить? пример можно?