Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

7

Помогите С Установкой Css3 Вкладок (Табов)

Автор NaLeeWay, 13 дек. 2012 11:37

css3 установка описание товар

Авторизуйтесь для ответа в теме

Сообщений в теме: 318

#301 Firefly

Активный участник

Модераторы
3 810 сообщений

Отправлено 12 Июль 2016 - 17:42

Котуся (12 Июль 2016 - 10:15) писал:

Добрый день!

Сейчас откачу назад.

Здравствуйте.
В редакторе главной страницы добавил Вам в начало код вида:

<div class="tabs_block">
<div class="htabs" id="tabs"><a class="active" href="javascript:tabSwitch(1);" id="tab_1">Сорт 2/2</a> <a href="javascript:tabSwitch(2);" id="tab_2">Сорт 2/3</a> <a href="javascript:tabSwitch(3);" id="tab_3">Сорт 2/4</a> <a href="javascript:tabSwitch(4);" id="tab_4">Сорт 3/3</a> <a href="javascript:tabSwitch(5);" id="tab_4">Сорт 3/4</a> <a href="javascript:tabSwitch(6);" id="tab_4">Сорт 4/4</a></div>
<div class="tab-content" id="content_1">1</div>
<div class="tab-content" id="content_2">2</div>
<div class="tab-content" id="content_3">3</div>
<div class="tab-content" id="content_4">4</div>
<div class="tab-content" id="content_5">5</div>
<div class="tab-content" id="content_6">6</div>
</div>

В этом коде Вы можете указать требуемый контент по вкладкам вместо цифр 1 - 6.
Предыдущий код окна с вкладками, расположенный ниже Вы можете удалить, если Вас устроит данный вариант.

Наверх

#302 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 13 Июль 2016 - 10:06

Спасибо Вам огромное!!!!!!

Получилось так, как я хотела. Только в первой вкладке не высвечивается заголовок таблицы, хотя он прописан.

И таких табов нужно будет как минимум 5 штук. Их просто скопировать можно или нужно как то еще прописывать, подскажите пожалуйста))

Наверх

#303 Firefly

Активный участник

Модераторы
3 810 сообщений

Отправлено 13 Июль 2016 - 11:41

Котуся (13 Июль 2016 - 10:06) писал:

Спасибо Вам огромное!!!!!!

Получилось так, как я хотела. Только в первой вкладке не высвечивается заголовок таблицы, хотя он прописан.

И таких табов нужно будет как минимум 5 штук. Их просто скопировать можно или нужно как то еще прописывать, подскажите пожалуйста))

Добавил Вам новые блоки с табами. Контентные блоки выглядят так:

<div class="tab-content" id="content_7">7
</div>
<div class="tab-content" id="content_8">8
</div>
<div class="tab-content" id="content_9">9
</div>
<div class="tab-content" id="content_10">10
</div>
<div class="tab-content" id="content_11">11
</div>

Так же убрал стиль, который скрывал заголовок для контента первого таба. Проверьте, пожалуйста.

Наверх

#304 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 13 Июль 2016 - 13:40

Я , наверное, не так выразилась:

будет ориентировочно 4 блока с с табами, каждый блок будет идти под отдельный материал:
1. блок - прайс лист на фанеру ФК (6 вкладок)
2. Прайс лист На фанеру ФСФ 2440*1220 (6 вкладок)
3. Прайс лист на фанеру фсф 3000*1500 (6 вкладок)
4. Блок с вкладками МДФ, ДСП, ЛМДФ, ЛДСП, ХДФ, ДВП, ДВПО

Заголовок появился, спасибо))

Наверх

#305 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 13 Июль 2016 - 16:29

Помогите пожалуйста доделать

Наверх

#306 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 13 Июль 2016 - 17:04

вопрос снят, разобралась))

Наверх

#307 Firefly

Активный участник

Модераторы
3 810 сообщений

Отправлено 13 Июль 2016 - 21:22

Котуся (13 Июль 2016 - 13:40) писал:

Я , наверное, не так выразилась:

будет ориентировочно 4 блока с с табами, каждый блок будет идти под отдельный материал:
1. блок - прайс лист на фанеру ФК (6 вкладок)
2. Прайс лист На фанеру ФСФ 2440*1220 (6 вкладок)
3. Прайс лист на фанеру фсф 3000*1500 (6 вкладок)
4. Блок с вкладками МДФ, ДСП, ЛМДФ, ЛДСП, ХДФ, ДВП, ДВПО

Заголовок появился, спасибо))

Для блоков с вкладками потребовалось написание отдельного скрипта с измененными идентификаторами.
Обычное дублирование первого блока в данном случае не работало бы правильно.

Проверьте сейчас, пожалуйста.

Наверх

#308 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 14 Июль 2016 - 08:51

Доброе утро!

Спасибо большое Вам за помощь!!

Надо чуть чуть подправить: не отражается таблица во втором блоке табов, первая вкладка.

Остальное еще не проверяла.

С

Наверх

#309 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 14 Июль 2016 - 14:53

У меня вот такие js ошибки теперь сайт выдает. Это от исправлений?

Проверьте пожалуйста .

Прикрепленные файлы

ошибки.doc 519,5К 108 Количество загрузок:

Наверх

#310 Stasya

Активный участник

Модератоpы
4 007 сообщений

Отправлено 14 Июль 2016 - 17:59

Котуся (14 Июль 2016 - 08:51) писал:

Доброе утро!

Спасибо большое Вам за помощь!!

Надо чуть чуть подправить: не отражается таблица во втором блоке табов, первая вкладка.

Остальное еще не проверяла.

С

Сейчас у Вас все работает корректно. Табы переключаются, контент соответственно тоже. Попробуйте почитить кэш Вашего браузера.

Прикрепленные изображения

Наверх

#311 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 15 Июль 2016 - 09:05

Добрый день!

Корректно работает только первый блок табов Фанера ФК.

А во втором информация вообще не показывается, хотя она там есть.

Проверьте пожалуйста.

После заголовка фанера ФСФ 2440*1220 который следует.

Наверх

#312 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 15 Июль 2016 - 12:46

Мне кто нибудь подскажет?

Наверх

#313 MikDark

Активный участник

Модераторы
6 468 сообщений

Отправлено 15 Июль 2016 - 15:29

Котуся (15 Июль 2016 - 09:05) писал:

Добрый день!

Корректно работает только первый блок табов Фанера ФК.

А во втором информация вообще не показывается, хотя она там есть.

Проверьте пожалуйста.

После заголовка фанера ФСФ 2440*1220 который следует.

У Вас неправильно построен код текста вкладок
У Вас стоит:

<div class="tab-content" id="content_7">&nbsp; 1
<div class="tabs_block1" style="line-height: 18.2px;">
<div class="tab-content" id="content_6">

т.е. применяется id="content_7" как и нужно, а потом в нем, id="content_6", который вообще от первой таблицы и по-умолчанию скрыть. Вам нужно убрать везде эту строку и соответствующий закрывающий </div>

Наверх

#314 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 15 Июль 2016 - 16:27

Спасибо за ответ, сейчас попробую внести изменения.

Наверх

#315 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 26 Июль 2016 - 10:57

Добрый день!

Начала переделывать табы, еще больше запуталась.
На главной странице во втором блоке табов (Фанера ФСФ 2440*1220) некорректно отображаются таблички, съезжают вниз.

Помогите пожалуйста подправить.

Наверх

#316 Vaccina

Активный участник

Модераторы
24 353 сообщений

Отправлено 27 Июль 2016 - 05:15

Ох, как же вы еще ранее не запутались там =) Советую все это перенести в шаблон Страница и выводить только на главной, там хотя бы структуру можно визуально обозначить и комментарии к каждому куску кода установить.
В одном из блоков у вас присутствует пустой блок с отступом, нажмите источник, найдите:

<div class="tabs_block1" style="line-height: 18.2px;">
<h3 style="text-align: center;">&nbsp;</h3>
</div>
<div class="tab-content" id="content_8">&nbsp;&nbsp;
<div class="tabs_block1" style="line-height: 18.2px;">

замените на:

<div class="tab-content" id="content_8">&nbsp;&nbsp;
<div class="tabs_block1" style="line-height: 18.2px;">

Наверх

#317 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 27 Июль 2016 - 10:28

Спасибо большое за ответ.

Вакцина, а как грамотно все это перенести в шаблон Страница?

Наверх

#318 Vaccina

Активный участник

Модераторы
24 353 сообщений

Отправлено 28 Июль 2016 - 01:16

В шаблоне Страница после:

{% IFNOT index_page %}
  <div class="breadcrumbs_box">
	<a href="http://{NET_DOMAIN}/" title="Перейти на главную" class="headerNavigation1">Главная</a>
	<span class="headerNavigation">{PAGE_NAME}</span>
  </div>
  <h1 class="heading_title">{PAGE_NAME}</h1>
 
{% ENDIF %}

пропишите код по следующей структуре:

{% IF PAGE_NAME = Название страницы %}
код вкладок
{% ENDIF %}

В нем вместо "Название страницы" укажите текст заголовка страницы с табами, в описании страницы нажмите "Источник" и скопируйте код и перенесите его в шаблон страница вместо "код вкладок"

Наверх

#319 Котуся

Продвинутый пользователь

Пользователи
118 сообщений

Отправлено 28 Июль 2016 - 08:53

Vaccina (28 Июль 2016 - 01:16) писал:

В шаблоне Страница после:

{% IFNOT index_page %}
<div class="breadcrumbs_box">
<a href="http://{NET_DOMAIN}/" title="Перейти на главную" class="headerNavigation1">Главная</a>
<span class="headerNavigation">{PAGE_NAME}</span>
</div>
<h1 class="heading_title">{PAGE_NAME}</h1>

{% ENDIF %}

пропишите код по следующей структуре:

{% IF PAGE_NAME = Название страницы %}
код вкладок
{% ENDIF %}

В нем вместо "Название страницы" укажите текст заголовка страницы с табами, в описании страницы нажмите "Источник" и скопируйте код и перенесите его в шаблон страница вместо "код вкладок"

Vaccina (28 Июль 2016 - 01:16) писал:

В шаблоне Страница после:

{% IFNOT index_page %}
<div class="breadcrumbs_box">
<a href="http://{NET_DOMAIN}/" title="Перейти на главную" class="headerNavigation1">Главная</a>
<span class="headerNavigation">{PAGE_NAME}</span>
</div>
<h1 class="heading_title">{PAGE_NAME}</h1>

{% ENDIF %}

пропишите код по следующей структуре:

{% IF PAGE_NAME = Название страницы %}
код вкладок
{% ENDIF %}

В нем вместо "Название страницы" укажите текст заголовка страницы с табами, в описании страницы нажмите "Источник" и скопируйте код и перенесите его в шаблон страница вместо "код вкладок"

Спасибо, сейчас буду пробовать))