Отменить html в выбранных breakpoints

Сообщение **semyonl** » 13 окт 2019, 05:02

Есть ли возможность отменить html код в выбранных breakpoints? Хотел бы вставить виджет ВК на сайт, нужно чтобы он выводился только для breakpoints до 768px.

Сообщение **spoon** » 13 окт 2019, 08:08

Код: Выделить всё

$(window).width() > 768 ? виджет_вк() : false;

Сообщение **semyonl** » 15 окт 2019, 04:38

Куда вставить эту часть кода?

Код: Выделить всё

<script type="text/javascript" src="https://vk.com/js/api/openapi.js?162"></script>
<!-- VK Widget -->
<div id="vk_community_messages"></div>
<script type="text/javascript">
VK.Widgets.CommunityMessages("vk_community_messages", 33784821, {expandTimeout: "15000",tooltipButtonText: "Есть вопрос?"});
</script>

Сообщение **spoon** » 15 окт 2019, 06:49

Можно просто скрыть блок vk:

Код: Выделить всё

$(window).width() > 768 ? $('#vk_community_messages').hide() : $('#vk_community_messages').show();

Или на css:

Код: Выделить всё

@media (max-width:768px) {
 #vk_community_messages { display: none; }
}

Сообщение **semyonl** » 15 окт 2019, 15:02

Как правильно вставить в html? Так не работает, вставлял в разные части кода.

Код: Выделить всё

<script type="text/javascript" src="https://vk.com/js/api/openapi.js?162"></script>
<!-- VK Widget -->
<div id="vk_community_messages"></div>
<script type="text/javascript">
VK.Widgets.CommunityMessages("vk_community_messages", 33784821, {expandTimeout: "15000",tooltipButtonText: "Есть вопрос?"});
</script>
$(window).width() > 768 ? $('#vk_community_messages').hide() : $('#vk_community_messages').show();

Код: Выделить всё

<script type="text/javascript" src="https://vk.com/js/api/openapi.js?162"></script>
<!-- VK Widget -->
<div id="vk_community_messages"></div>
<script type="text/javascript">
VK.Widgets.CommunityMessages("vk_community_messages", 33784821, {expandTimeout: "15000",tooltipButtonText: "Есть вопрос?"});
</script>
@media (max-width:768px) {
 #vk_community_messages { display: none; }
}

Сообщение **spoon** » 15 окт 2019, 18:29

Если через js то перед </body>:

Код: Выделить всё

<script>
$(window).width() > 768 ? $('#vk_community_messages').hide() : $('#vk_community_messages').show();
</script>

Если через css, то в <head> или HTML :

Код: Выделить всё

<style>
@media (max-width:768px) {
 #vk_community_messages { display: none; }
}
</style>

Сообщение **semyonl** » 16 окт 2019, 05:00

Спасибо, получилось!

Кто сейчас на конференции

Добро пожаловать на форум!