Убрать блок, и по кнопке показать модальное окно с ним

253
19 августа 2017, 03:16

Помогите, сделать чтобы при загрузке второго блок не было видно - div class="tabs__content active_tab

а при нажатии подробнее, появлялось модальное окно с ним - div class="tabs__content active_tab

<div class="tabs__content active_tab"> 
  <div class="tabs__content__wrapper"> 
    <div class="tabs__content_block"> 
      <div class="catalog-new-product">Lorem </div> 
      <div class="catalog-new-price-strikeout">78 900 руб.</div> 
      <div class="catalog-new-price-stock">Цена по акции</div> 
      <div class="catalog-new-price">71 010 руб.</div> 
      <a class="catalog-modal-trigger" href="#request-product-topas200"><img border="0" alt="" src="http://via.placeholder.com/350x150"></a> 
      <a class="catalog-new-btn catalog-modal-trigger" href="#request-product-topas200">Узнать подробнее</a> 
    </div> 
  </div> 
</div> 
 
<br/> 
<hr/> 
<br/> 
 
 
<div class="inner_wrap_catalog_new"> 
  <div class="h1">Lorem</div> 
  <div class="card_catalog_new"> 
    <div class="cardMain_catalog_new"><img src="http://via.placeholder.com/350x150" alt=""></div> 
    <div class="cardTech_catalog_new"> 
      <div class="price_catalog_new"> 
        <table> 
          <tbody> 
            <tr> 
              <td width="50%">Lorem</td> 
              <td width="50%"><span class="shock_catalog_new">Lorem</span></td> 
            </tr> 
            <tr> 
              <td class="newPrice_catalog_retail">0000 
              </td> 
              <td class="newPrice_catalog_newTd">Lorem</td> 
            </tr> 
          </tbody> 
        </table> 
      </div> 
      <table cellspacing="0" cellpadding="0" class="params_catalog_new"> 
        <tbody> 
          <tr> 
            <td>Lorem</td> 
            <td>4</td> 
          </tr> 
        </tbody> 
      </table> 
    </div> 
  </div> 
  <div class="inner-text_catalog_new"> 
    <p>Lorem 
      <p> 
  </div> 
 
  <div class="links"> 
    <div class="links-inner"> 
      <a class="catalog-modal-trigger current" href="#"><span>Lorem</span> 
(00000 руб.)</a> 
      <a class="catalog-modal-trigger" href="#"><span>Lorem</span> 
(00000 руб.)</a> 
    </div> 
  </div> 
 
  <h3>Lorem</h3> 
  <form method="post" action="#" onsubmit="return false;"> 
    <input type="text" name="name" placeholder="Введите Ваше Имя" title="Имя" maxlength="50"> 
    <input type="tel" name="phone" placeholder="Введите телефон" title="Номер телефона" pattern="(\+?\d[- .()]*){7,18}" maxlength="18"> 
    <input type="hidden" name="formname" value=""> 
    <input type="hidden" name="septic" value=""> 
    <input type="hidden" name="ref" value=""> 
    <input type="hidden" name="ref_info" value=""> 
    <input type="hidden" name="lpm_ref_info" value=""> 
    <button>Lorem</button> 
  </form> 
</div>

Answer 1

Зачем вам тут php? Разместите .tabs__content.active_tab по середине экрана, привяжите к экрану и сделайте его display:none;. При нажатии на "Подробнее":

$('.tabs__content').show();

Потом при нажатии вне $('.tabs__content') - скрываем.

READ ALSO
.htaccess 301 Redirect кроме некоторых адресов

.htaccess 301 Redirect кроме некоторых адресов

Всем привет, есть такой код который делает 301 редирект, а также убирает с url адреса папку site

192
Php парсинг массива

Php парсинг массива

Добрый день! Помогите пожалуйста со следующим вопросомДано IPv4 адреса и список подсетей к которым они должны принадлежать

253
Существует ли аналог imagettfbbox() в ImageMagick?

Существует ли аналог imagettfbbox() в ImageMagick?

ПриветствуюИщу аналог функции php/GD imagettfbbox() в php/ImageMagick, так как во всём приложении используется php/ImageMagick и ради одной функции ставить GD как-то...

259
yii2 убрать в форме у имён полей префикс имени модели

yii2 убрать в форме у имён полей префикс имени модели

Как убрать в форме у имён полей префикс имени моделиСейчас поля такие (смотри ниже)

280