Показать сообщение отдельно
  #3 (permalink)  
Старый 13.05.2016, 16:19
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

mcdark,
убрал лишнее ...
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .hide{
    display:none;
    word-break:break-all;
  }
 .tg{
  border-collapse:collapse;
  border-spacing:0;
  border-color:#999;
}

.tg td{
  font-family:Arial,sans-serif;
  font-size:14px;
  padding:10px 5px;
  border-style:solid;
  border-width:0px;
  word-break:normal;
  border-color:#999;
  color:#444;
  background-color:#F7FDFA;
}

.tg th{
  font-family:Arial,sans-serif;
  font-size:14px;
  font-weight:normal;
  padding:10px 5px;
  border-style:solid;
  border-width:0px;
  overflow:hidden;
  word-break:normal;
  border-color:#999;
  color:#fff;
  background-color:#26ADE4;
}

.tg .tg-yw4l{
  vertical-align:top;
}

th.tg-sort-header::-moz-selection{
  background:transparent;
}

th.tg-sort-header::selection{
  background:transparent;
}

th.tg-sort-header{
  cursor:pointer;
}

table th.tg-sort-header:after{
  content:'';
  float:right;
  margin-top:7px;
  border-width:0 4px 4px;
  border-style:solid;
  border-color:#404040 transparent;
  visibility:hidden;
}

table th.tg-sort-header:hover:after{
  visibility:visible;
}

table th.tg-sort-desc:after,table th.tg-sort-asc:after,table th.tg-sort-asc:hover:after{
  visibility:visible;
  opacity:0.4;
}

table th.tg-sort-desc:after{
  border-bottom:none;
  border-width:4px 4px 0;
}
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
   <script>
$(function(){
    var $hide = $('.hide');
    $hide.each(function(indx, el){
     var parent = $(el).parents("td"),
         w = parent.width(),
         $a = $("a", parent);
     $(el).width(w);
     $a.on('click', function(event) {
      event.preventDefault();
      $hide.not(el).slideUp(500);
      $(el).slideToggle(500);
    });

      });


});
</script>
</head>

<body>
<style type="text/css">

</style>

<table id="tg-0RK1w" class="tg">
  <tr>
    <th class="tg-yw4l">Продукт</th>
    <th class="tg-yw4l">Кол-во</th>
    <th class="tg-yw4l">Принадлежность в %</th>
    <th class="tg-yw4l">Пояснение</th>
    <th class="tg-yw4l">Действия</th>
    <th class="tg-yw4l"></th>
  </tr>
  <tr>
    <td class="tg-yw4l">

  <a href="#">Superfaza Bronze (может)</a>
  <div class="hide">При заходе с WEB браузера защита может попросить телефон.
Работает однозначно точно Москва/Питер, возможны ответы на вопросы по почте сервиса yandex.ru (можно найди в соответствующем разделе).
Поля заполнить обязательно, обратить внимание на профиль.
Формат:
Name:LastName;skype;workmail;AccountNumber:reg_id;DeviceName;BrowserName</div>




</td>
    <td class="tg-yw4l">10</td>
    <td class="tg-yw4l">2</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">
  <a href="#">Superfaza Super Bronze (может)</a>
  <div class="hide">При заходе с WEB браузера защита может попросить телефон.
Работает однозначно точно Москва/Питер, возможны ответы на вопросы по почте сервиса yandex.ru (можно найди в соответствующем разделе).
Поля заполнить обязательно, обратить внимание на профиль.
Формат:
Name:LastName;skype;workmail;AccountNumber:reg_id;DeviceName;BrowserName</div>

</td>
    <td class="tg-yw4l">0</td>
    <td class="tg-yw4l">3</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">Superfaza Vip Bronze (может)</td>
    <td class="tg-yw4l">0</td>
    <td class="tg-yw4l">5</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">Superfaza Silver</td>
    <td class="tg-yw4l">22</td>
    <td class="tg-yw4l">8</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">Superfaza Super Silver</td>
    <td class="tg-yw4l">1340</td>
    <td class="tg-yw4l">10</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">Superfaza Vip Silver</td>
    <td class="tg-yw4l">0</td>
    <td class="tg-yw4l">15</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">Superfaza Gold</td>
    <td class="tg-yw4l">25</td>
    <td class="tg-yw4l">20</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">Superfaza Super Gold</td>
    <td class="tg-yw4l">20</td>
    <td class="tg-yw4l">40</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">Superfaza Vip Gold</td>
    <td class="tg-yw4l">281</td>
    <td class="tg-yw4l">40</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
  <tr>
    <td class="tg-yw4l">Superfaza Platinum</td>
    <td class="tg-yw4l">967</td>
    <td class="tg-yw4l">50</td>
    <td class="tg-yw4l">тут любая информация — критерии чего-то</td>
    <td class="tg-yw4l">Посмотреть</td>
    <td class="tg-yw4l">Отправить</td>
  </tr>
</table>


</body>
</html>
Ответить с цитированием