Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.01.2016, 10:41
Кандидат Javascript-наук
Отправить личное сообщение для Castromen Посмотреть профиль Найти все сообщения от Castromen
 
Регистрация: 04.02.2015
Сообщений: 116

Скрыть/Отобразить колонку в таблицы
Доброе утро.
Подскажите плз как скрыть/развернуть колонку при нажатие на кнопку.

Сначала после нажатие на кнопку [Скрыть/Развернуть] скрывается первая колонка а вторая растягивается на 100%.
И обратное действие.
Спасибо.

<table border="0" class="ms-pub-contentLayout ms-verticalAlignTop">
<tr>
<td valign="top" width="300px"> </td> <!--скрыть при нажатие -->
<td valign="top" width="885px"> </td>
</tr>
</table>
Ответить с цитированием
  #2 (permalink)  
Старый 14.01.2016, 10:47
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Castromen,
а на что жмакать для
Сообщение от Castromen
Развернуть
?
Ответить с цитированием
  #3 (permalink)  
Старый 14.01.2016, 10:52
Кандидат Javascript-наук
Отправить личное сообщение для Castromen Посмотреть профиль Найти все сообщения от Castromen
 
Регистрация: 04.02.2015
Сообщений: 116

рони,
На туже кнопку
Ответить с цитированием
  #4 (permalink)  
Старый 14.01.2016, 11:08
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Castromen,
и где кнопа?
Ответить с цитированием
  #5 (permalink)  
Старый 14.01.2016, 11:13
Кандидат Javascript-наук
Отправить личное сообщение для Castromen Посмотреть профиль Найти все сообщения от Castromen
 
Регистрация: 04.02.2015
Сообщений: 116

<button class="btn btn-success active" type="button"><span class="glyphicon glyphicon-th-list"></span>
Скрыть/Развернуть</button>
Ответить с цитированием
  #6 (permalink)  
Старый 14.01.2016, 11:21
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Castromen,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  td{
    height: 45px;
     border: 1px solid #0000FF;
     transition: all .8s ease-in-out;
  }

  .hide td:nth-child(1){
     display: none;
  }
  .hide td:nth-child(2){
      width: 1185px;
      background-color: #1E90FF;
  }
  table{
  border-collapse: collapse;
  }

  </style>
</head>

<body>
<table border="0" class="ms-pub-contentLayout ms-verticalAlignTop">
 <tr>
 <td valign="top" width="300px"> </td> <!--скрыть при нажатие -->
 <td valign="top" width="885px"> </td>
 </tr>
 </table>
 <button class="btn btn-success active" type="button"><span class="glyphicon glyphicon-th-list"></span>
Скрыть/Развернуть</button>
<script>
 window.addEventListener("DOMContentLoaded", function() {
     var d = document.querySelector(".btn-success"),
         e = document.querySelector(".ms-pub-contentLayout");
     d.addEventListener("click", function(a) {
        a.preventDefault();
        e.classList.toggle("hide")
     })
 });
</script>
</body>

</html>
Ответить с цитированием
  #7 (permalink)  
Старый 14.01.2016, 12:47
Кандидат Javascript-наук
Отправить личное сообщение для Castromen Посмотреть профиль Найти все сообщения от Castromen
 
Регистрация: 04.02.2015
Сообщений: 116

рони, спасибо.
Странно но у меня почему то не работает =(
Ответить с цитированием
  #8 (permalink)  
Старый 14.01.2016, 12:49
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Castromen,
смотрите ваше css
Ответить с цитированием
  #9 (permalink)  
Старый 14.01.2016, 13:43
Кандидат Javascript-наук
Отправить личное сообщение для Castromen Посмотреть профиль Найти все сообщения от Castromen
 
Регистрация: 04.02.2015
Сообщений: 116

рони,
Спасибо все поправил.
Вопрос а как закрепить за пользователем допустим если он скрыл а то при обновление и переходе на другую страницу опять открывается левая колонка.
Ответить с цитированием
  #10 (permalink)  
Старый 14.01.2016, 13:51
Профессор
Отправить личное сообщение для Siend Посмотреть профиль Найти все сообщения от Siend
 
Регистрация: 04.02.2012
Сообщений: 196

Castromen, для этого тебе нужно сохранять состояние в cookie, и при отображении вьюхи смотреть на состояние и выдавать соотвествующий результат.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Генерация таблицы из JSON Lemme Общие вопросы Javascript 32 23.07.2015 21:55
Как передать данные в другую панель из выбранной строки таблицы. layout: 'card'. Пролетарий ExtJS 5 03.06.2015 22:53
фильтрация .csv таблицы br1ck Элементы интерфейса 0 13.11.2013 08:35
Через ajax отправить много данных из таблицы на сервер Heger jQuery 3 29.08.2012 18:51
Фиксированный заголовок таблицы ilshat Элементы интерфейса 6 20.12.2008 00:35