Перейти к содержанию
WellChuck

Убрать категории при просмотре с мобильного

Рекомендуемые сообщения

Уважаемые гуру, нуждаюсь в ваших знаниях!

 

Собственно пытаюсь сделать адаптивный дизайн через @media и столкнулся с проблемой.

Суть в том, что мне нужно убрать блок категорий в карточке товара при просмотре с мобильных устройств.

 

Подсобите советом, буду безмерно благодарен!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты


<div class="hidden-xs hidden-sm">

  • +1 2

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты


@media screen and (max-width: 414px) {

.category_block {

display:none;

}

}

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
<div class="hidden-xs hidden-sm">

Может я ошибаюсь, но каким образом у меня на мобильном устройстве при наличии данных классов будут отображаться категории на главной и не будут на странице товара?

 

@media screen and (max-width: 414px) {
	.category_block {
               display:none;
	}
}

Та же штука

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Единственное до чего додумался мой воспаленный мозг

<script type="text/javascript">
	$(document).ready(function(){
		if(window.screen.width < 768) {
		$('#verticalmenu').css("display", "none");
		}
});
</script>

:mellow:

 

Просто если так решать вопросы с проблемными блоками, мне кажется я засру всё js-ом...

Изменено пользователем WellChuck

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Может я ошибаюсь, но каким образом у меня на мобильном устройстве при наличии данных классов будут отображаться категории на главной и не будут на странице товара?

 

Та же штука

 

Вопрос тогда в следующем, каким способом вы делаете адаптивным дизайн?

1ый и 2ой варианты рабочие для bootstrap

 

.hidden-xs = Скрыт для телефоны (<768px)

.hidden-sm = Скрыт для планшеты (≥768px)

 

Что еще надо? :)

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Вопрос тогда в следующем, каким способом вы делаете адаптивным дизайн?

1ый и 2ой варианты рабочие для bootstrap

 

.hidden-xs = Скрыт для телефоны (<768px)

.hidden-sm = Скрыт для планшеты (≥768px)

 

Что еще надо? :)

Я это прекрасно понимаю. Но если я пропишу блоку с категориями эти классы то он будет скрываться везде, а мне надо скрыть его только на странице товара.

 

Или я поехавший и не понимаю как это работает? :mellow:

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Я это прекрасно понимаю. Но если я пропишу блоку с категориями эти классы то он будет скрываться везде, а мне надо скрыть его только на странице товара.

 

Или я поехавший и не понимаю как это работает? :mellow:

 

 

Ну можно так (/catalog/view/theme/default/template/module/category.tpl): 

<?php if ($this->request->get['route'] === 'product/product') :?>
    <div class="hidden-xs hidden-sm">
<?php endif ?>
<div class="box">
  <div class="box-heading"><?php echo $heading_title; ?></div>
  <div class="box-content">
    <ul class="box-category">
      <?php foreach ($categories as $category) { ?>
      <li>
        <?php if ($category['category_id'] == $category_id) { ?>
        <a href="<?php echo $category['href']; ?>" class="active"><?php echo $category['name']; ?></a>
        <?php } else { ?>
        <a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a>
        <?php } ?>
        <?php if ($category['children']) { ?>
        <ul>
          <?php foreach ($category['children'] as $child) { ?>
          <li>
            <?php if ($child['category_id'] == $child_id) { ?>
            <a href="<?php echo $child['href']; ?>" class="active"> - <?php echo $child['name']; ?></a>
            <?php } else { ?>
            <a href="<?php echo $child['href']; ?>"> - <?php echo $child['name']; ?></a>
            <?php } ?>
          </li>
          <?php } ?>
        </ul>
        <?php } ?>
      </li>
      <?php } ?>
    </ul>
  </div>
</div>
<?php if ($this->request->get['route'] === 'product/product') :?>
    </div>
<?php endif ?>
  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

 

Ну можно так (/catalog/view/theme/default/template/module/category.tpl): 

<?php if ($this->request->get['route'] === 'product/product') :?>
    <div class="hidden-xs hidden-sm">
<?php endif ?>
<div class="box">
  <div class="box-heading"><?php echo $heading_title; ?></div>
  <div class="box-content">
    <ul class="box-category">
      <?php foreach ($categories as $category) { ?>
      <li>
        <?php if ($category['category_id'] == $category_id) { ?>
        <a href="<?php echo $category['href']; ?>" class="active"><?php echo $category['name']; ?></a>
        <?php } else { ?>
        <a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a>
        <?php } ?>
        <?php if ($category['children']) { ?>
        <ul>
          <?php foreach ($category['children'] as $child) { ?>
          <li>
            <?php if ($child['category_id'] == $child_id) { ?>
            <a href="<?php echo $child['href']; ?>" class="active"> - <?php echo $child['name']; ?></a>
            <?php } else { ?>
            <a href="<?php echo $child['href']; ?>"> - <?php echo $child['name']; ?></a>
            <?php } ?>
          </li>
          <?php } ?>
        </ul>
        <?php } ?>
      </li>
      <?php } ?>
    </ul>
  </div>
</div>
<?php if ($this->request->get['route'] === 'product/product') :?>
    </div>
<?php endif ?>

Господь, ты ли это?

Все работает, спасибо и большой к твоей карме.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.