Проблема Сдвинуть див

Тема в разделе "Интерактивные возможности", создана пользователем tanyaromanyuk94, 05.10.2015.

  1. tanyaromanyuk94
    Offline

    tanyaromanyuk94 Пользователь

    Регистрация:
    02.09.2015
    Сообщения:
    42
    Симпатии:
    0
    На сайте http://deltaunion2-001-site1.anytempurl.com/index.php/ru/
    Есть три кнопки "календарь", "формат мероприятия", "название теплохода". В каждой из них есть выпадающий список.
    При открытии его блок под кнопками сдвигается.
    Делала это вот таким скриптом:
    Код (javascript):
    1. jQuery(document).ready(function(){
    2.     jQuery('#dd').click(function() {
    3.             if (jQuery('.calendar').height() < 300) {
    4.                 jQuery('.calendar').animate({
    5.                     height: 400
    6.                 }, 350)
    7.             } else {
    8.                 jQuery('.calendar').animate({
    9.                     height: 400
    10.                 }, 350)
    11.             }
    12.         })
    13.  
    14.         jQuery('body').not('#dd').click(function() {
    15.             jQuery('.calendar').animate({
    16.                 height: 250
    17.             }, 350)
    18.         });  
    19. })



    Вопрос: Как сделать тоже самое только с таблицей, которая расположена ниже. При нажатии на ссылку "Киев межигорье" так же выпадает список. Как сделать, чтоб он выпадал под таблице, сдвигая при этом таблицу ниже?
    Этим скриптом не получается(
     
  2.  
  3. draff
    Offline

    draff Russian Joomla! Team Команда форума

    Регистрация:
    17.01.2011
    Сообщения:
    6 054
    Симпатии:
    520
    Пол:
    Мужской
    slideToggle() в помощь и конструкцию сделай,чтоб при клике на любой элемент страницы, твои блоки исчезали- slideUp("slow").
    А по вопросу- список в таблице,и нужно сдвинуть таблицу ?
     
  4. tanyaromanyuk94
    Offline

    tanyaromanyuk94 Пользователь

    Регистрация:
    02.09.2015
    Сообщения:
    42
    Симпатии:
    0
    Таблица не одна. Из 4 штуки. И они идут одна за другой. Друг под другом. dropdown2 - это и есть список. Нужно что он выпадал под таблицей, сдвигая ту что под ней. А при закрытии списка, все возвращалось на свои места
    Код (html):
    1. <table class="simple-little-table" style="height: 282px; width: 763px;" cellspacing="0">
    2. <tbody>
    3. <tr>
    4. <th style="background-color: white;">
    5. <div id="r" class="Reyc" tabindex="1">Рейс</div>
    6. </th>
    7. <th>
    8. <div id="dddd" class="wrapper-dropdown-5" tabindex="1">Киев-Межигорье
    9. <div class="table_list">
    10. <ul class="dropdown2">
    11. <li><a href="#"><em class="icon-envelope icon-large"></em>Текст 1</a></li>
    12. <li><a href="#"><em class="icon-truck icon-large"></em>Текст 2</a></li>
    13. <li><a href="#"><em class="icon-plane icon-large"></em>Текст 3</a></li>
    14. </ul>
    15. </div>
    16. </div>
    17. </th>
    18. </tr>
    19. <!-- Table Header -->
    20. <tr>
    21. <td>Дни</td>
    22. <td>Сб, Вс</td>
    23. </tr>
    24. <!-- Table Row -->
    25. <tr>
    26. <td>Теплоход</td>
    27. <td>Яков Задорожный</td>
    28. </tr>
    29. <!-- Darker Table Row -->
    30. <tr>
    31. <td>Начало рейса</td>
    32. <td>16.00</td>
    33. </tr>
    34. <tr>
    35. <td>Продолжительность рейса</td>
    36. <td>2 часа</td>
    37. </tr>
    38. <tr>
    39. <td>Причал</td>
    40. <td>№7</td>
    41. </tr>
    42. <tr>
    43. <td>Стоимость взрослого билета</td>
    44. <td>180 грн</td>
    45. </tr>
    46. <tr>
    47. <td>Стоимость детского билета</td>
    48. <td>150 грн</td>
    49. </tr>
    50. </tbody>
    51. </table>
     

Поделиться этой страницей

Загрузка...