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

Discussion in 'Интерактивные возможности' started by tanyaromanyuk94, Oct 5, 2015.

  1. tanyaromanyuk94
    Offline

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

    Joined:
    Sep 2, 2015
    Messages:
    44
    Likes Received:
    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. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    slideToggle() в помощь и конструкцию сделай,чтоб при клике на любой элемент страницы, твои блоки исчезали- slideUp("slow").
    А по вопросу- список в таблице,и нужно сдвинуть таблицу ?
     
  4. tanyaromanyuk94
    Offline

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

    Joined:
    Sep 2, 2015
    Messages:
    44
    Likes Received:
    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>
     

Share This Page

Loading...