X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

Открыть тему
Тема закрыта
> Как сделать адаптивной таблицу!, У кого какие варианты
Sev_free
Sev_free
Topic Starter сообщение 2.7.2015, 17:35; Ответить: Sev_free
Сообщение #1


Частый гость
**

Группа: User
Сообщений: 97
Регистрация: 19.6.2015
Из: Севастополь
Поблагодарили: 18 раз
Репутация:   2  


Вот сам код:
Развернуть/Свернуть

Код
<div id="wpshop_cart">
<table class="recycle_bin" cellspacing="0" cellpadding="5" border="0">
<thead>
<tr>
<th class="name">Наименование</th>
<th class="type"></th>
<th class="cost">Цена (руб.)</th>
<th class="num">Кол-во</th>
<th class="total">Сумма (руб.)</th>
<th class="delete"> </th>
</tr>
</thead>
<tbody>
<tr class="rb_item" valign="top">
<td class="rb_name">
<a href="http://www.pureprotein-msc.ru/protein-multikomponentnyj/">Протеин мультикомпонентный</a>
</td>
<td class="rb_type">Шоколадное печенье </td>
<td class="rb_cost">940</td>
<td class="rb_num">
<a class="minus" onmousedown="__cart.minus('7556', 'Шоколадное печенье', 1,0); return false;" href="#">−</a>
<a class="plus" onmousedown="__cart.plus('7556', 'Шоколадное печенье', 1,0); return false;" href="#">+</a>
<input type="text" onchange="__cart.set('7556', 'Шоколадное печенье', this.value,0); return false;" maxlength="6" size="3" value="1">
</td>
<td class="rb_total">940</td>
<td class="rb_delete">
<a style="text-decoration:none; color:#f00;" onclick="__cart.remove('7556', 'Шоколадное печенье',0); return false;" href="#" title="Удалить">×</a>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td align="right" colspan="4">
<strong>ИТОГО:</strong>
</td>
<td class="rb_total cost">
<strong>940</strong>
</td>
<td class="rb_delete">
<a style="text-decoration:none; color:#f00;" onclick="if (confirm('Очистить корзину?')) __cart.reset(); return false;" href="#" title="Удалить все">×</a>
</td>
</tr>
<tr id="delivery_cost" style="display:none;text-align:right;margin-top:15px">
<td style="font-weight:bold" colspan="4">
Стоимость с учетом доставки (
<span id="delivery_cost_value"></span>
руб.)
</td>
<td id="delivery_cost_total" style="text-align:left;font-weight:bold"></td>
<td></td>
</tr>
</tfoot>
</table>
</div>
<table id="payments-table">
<thead id="mode-paymets-title">
<tr>
<th colspan="4">Выберите способ оплаты:</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<a href="http://www.pureprotein-msc.ru/?wpshopcarts=vizit&payment=vizit">
<img title="Самовывоз - Филевский бульвар" src="http://www.pureprotein-msc.ru/wp-content/plugins/wp-shop/images/payments/vizit.gif">
</a>
<br>
<a href="http://www.pureprotein-msc.ru/?wpshopcarts=vizit&payment=vizit">Самовывоз - Филевский бульвар</a>
</td>
<td>
<a href="http://www.pureprotein-msc.ru/?wpshopcarts=cash&payment=cash">
<img title="Наличными курьеру" src="http://www.pureprotein-msc.ru/wp-content/plugins/wp-shop/images/payments/nal.gif">
</a>
<br>
<a href="http://www.pureprotein-msc.ru/?wpshopcarts=cash&payment=cash">Наличными курьеру</a>
</td>
<td>
<a href="http://www.pureprotein-msc.ru/?wpshopcarts=post&payment=post">
<img title="Доставка по России (предоплата)" src="http://www.pureprotein-msc.ru/wp-content/plugins/wp-shop/images/payments/post.gif">
</a>
<br>
<a href="http://www.pureprotein-msc.ru/?wpshopcarts=post&payment=post">Доставка по России (предоплата)</a>
</td>
<td>
<a href="http://www.pureprotein-msc.ru/?wpshopcarts=wm&payment=wm">
<img title="Web-Money" src="http://www.pureprotein-msc.ru/wp-content/plugins/wp-shop/images/payments/wm.gif">
</a>
<br>
<a href="http://www.pureprotein-msc.ru/?wpshopcarts=wm&payment=wm">Web-Money</a>
</td>
</tr>
</tbody>
</table></div></div>


Основная проблема в том, что это нужно сделать на экран в 200px.
П.С. Я уже себе всю думалку сломал.


--------------------
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
lostprophet
lostprophet
сообщение 2.7.2015, 17:41; Ответить: lostprophet
Сообщение #2


Топовый постер
*******

Группа: Super Moderator
Сообщений: 2567
Регистрация: 18.11.2008
Из: Ростов-на-Дону
Поблагодарили: 3172 раза
Репутация:   292  


1. https://css-tricks.com/responsive-data-tables/
2. http://exisweb.net/responsive-table-plugins-and-patterns
3. http://johnpolacek.github.io/stacktable.js/

P.S. PureProtein - плохой)


--------------------


Поблагодарили: (3)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Sev_free
Sev_free
Topic Starter сообщение 2.7.2015, 18:21; Ответить: Sev_free
Сообщение #3


Частый гость
**

Группа: User
Сообщений: 97
Регистрация: 19.6.2015
Из: Севастополь
Поблагодарили: 18 раз
Репутация:   2  


lostprophet, не подходит, и не могу найти код некоторых вещей в wp-shop.... например верхушку он берет не с шаблона, я так понимаю.


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
lostprophet
lostprophet
сообщение 2.7.2015, 18:52; Ответить: lostprophet
Сообщение #4


Топовый постер
*******

Группа: Super Moderator
Сообщений: 2567
Регистрация: 18.11.2008
Из: Ростов-на-Дону
Поблагодарили: 3172 раза
Репутация:   292  


Sev_free, спокойнее, первая ссылка - чистый css, ничего выдумывать не нужно. Просто еще раз спокойно посмотрите.


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Sev_free
Sev_free
Topic Starter сообщение 2.7.2015, 21:29; Ответить: Sev_free
Сообщение #5


Частый гость
**

Группа: User
Сообщений: 97
Регистрация: 19.6.2015
Из: Севастополь
Поблагодарили: 18 раз
Репутация:   2  


lostprophet, спасибо, успокоился,покумекал и сделал чуть подругому) Перебрал скрипт и обернул все дивами)

Вернее сделал свою div таблицу)


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Как мошенники зарабатывают на прямых трансляциях в Instagram
Не ждите порно в инстаграм, его нет
10 PostBrigada 1125 Вчера, 22:40
автор: JOHNY
Открытая тема (нет новых ответов) Маленький кейс как сделать много почтовых ящиков в Gmail
Один аккаунт = много ящиков
1 PostBrigada 509 Вчера, 21:34
автор: Pingunio
Горячая тема (нет новых ответов) Черный список обменников и как безопасно обменять валюту
141 Kurses 29911 Вчера, 13:04
автор: BestExchangers
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыКак черные SEO оптимизаторы собирают миллионы посетителей по высоко-актуальным запросам в Яндексе
5 serg5777 1550 Вчера, 11:05
автор: Ley
Открытая тема (нет новых ответов) Как действительно успешно внедрять привычки. И менять жизнь
seoandme.ru - SEO-блог Анны Ященко
14 AnnaYa 1423 Вчера, 8:49
автор: kaverima80


 



RSS Текстовая версия Сейчас: 16.12.2017, 7:40
Дизайн