Нужна помощь по модификации разметки модального окна (Twitter Bootstrap 3)

Тема в разделе "Верстка", создана пользователем 01K, 16 дек 2013.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    291
    Симпатии:
    43
    Добрый день!
    Нужна помощь в преобразовании старой разметки в новую.
    На демо сайте используется компонент отзывов - Skyline Testimonial:
    https://www.nulled.cc/threads/236847/
    К сожалению он поддерживает только bootstrap второй версии, сайт же на тройке.
    Проблема с модальным окном. С этим компонентом мне не приходилось работать, поэтому мои познания здесь сводятся к 0.
    Ближе с делу:
     
  2. ZOLK

    ZOLK

    Регистр.:
    13 сен 2011
    Сообщения:
    189
    Симпатии:
    107
    Если нажмешь посмотреть исходный код фрейма тогда становится видно что не грузятся один стиль
    <link rel="stylesheet" href="Перейти по ссылке" type="text/css" />

    Ведут на 404 страницу

    Может в этом направлении копать нужно?
     
  3. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    291
    Симпатии:
    43
    Не, этот так болтается. Наследие от какого-то скрипта :)
    + подскажите, на какой класс поменять "modal", чтобы кнопка нормально отображалась
     
  4. ZOLK

    ZOLK

    Регистр.:
    13 сен 2011
    Сообщения:
    189
    Симпатии:
    107
    так просто убери из класса modal и все

    <a id="submit-testimonial" class="btn btn-primary pull-right" href="/otzyvy?task=testimonial.add&amp;t_id=0&amp;return=aHR0cDovL3d3dy5rdXptYS50ay9vdHp5dnk=&amp;tmpl=component" rel="{handler: 'iframe', size: {x: 600, y: 550}}">
    Submit Your Testimonial </a>

    Кстати в хроме окно нормально отображается

    На самом деле в bootstrap 3 модальное окно так подключается
    Код:
    <!-- Button trigger modal -->
      <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-lg">Launch demo modal</a>
    
      <!-- Modal -->
      <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
              <h4 class="modal-title">Modal title</h4>
            </div>
            <div class="modal-body">
              ...
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
              <button type="button" class="btn btn-primary">Save changes</button>
            </div>
          </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
      </div><!-- /.modal -->
    
     
    Последнее редактирование: 16 дек 2013
  5. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    291
    Симпатии:
    43
    А, тогда да, кнопка появляется. Теперь остаётся вопрос со стилями самого окошка
    UPD> очень странно, если FireBug'ом удалить modal - то всё пучком. Стоит залезть в фаил и удалить, то модальное окно открывается в матринском окне!
     
    Последнее редактирование: 16 дек 2013
  6. ZOLK

    ZOLK

    Регистр.:
    13 сен 2011
    Сообщения:
    189
    Симпатии:
    107
    Если у тебя хостинг curl поддерживает то сделай так:
    PHP:
    <!-- Button trigger modal -->
    <a data-toggle="modal" href="#myModal" class="btn btn-primary pull-right" id="submit-testimonial">Submit Your Testimonial </a>
    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
    <div class="modal-content">
    <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
    <h4 class="modal-title">Modal title</h4>
    </div>
    <div class="modal-body">
    <?php
    $ch 
    curl_init();
    curl_setopt ($chCURLOPT_URL"http://АДРЕС_ТВОЕГО_САЙТА/otzyvy?task=testimonial.add&amp;t_id=0&amp;return=aHR0cDovL3d3dy5rdXptYS50ay9vdHp5dnk=&amp;tmpl=component");
    curl_setopt ($chCURLOPT_HEADER0);
    curl_exec ($ch);
    curl_close ($ch);
    ?>
    </div>
    <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary">Save changes</button>
    </div>
    </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
    Или айфрейм вставь вместо curl
     
  7. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    291
    Симпатии:
    43
    Тут, наверно, так не выйдет :(
    Само модальное окно вызывается соверешшно из другого файла...
    А ссылка создаётся таким вот макаром:
    Код:
    <a id="submit-testimonial" class="btn btn-primary modal pull-right" href="<?php echo SL_TestimonialsHelperRoute::getFormRoute(0, base64_encode($uri), true); ?>" rel="{handler: 'iframe', size: {x: 600, y: 550}}">
     
  8. NDK13

    NDK13 Создатель

    Регистр.:
    31 авг 2012
    Сообщения:
    36
    Симпатии:
    14
    В модальное окно подгружается контент в виде html страницы со всеми тэгами html body и прочими. Но фактически модальное окно это DIV, и полчается что в DIV попадает целая страница. В общем otzyvy?view=form&tmpl=component&layout=edit должен начинаться сразу с контента, например начинаться с table или div и завершаться ими же.
    P.S. firebug конечно классная штука, но имхо отладчик Хрома удобнее.