Перейти к публикации
View in the app

A better way to browse. Learn more.

Дизайн и модификация Invision Community

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Ширина элемента боковой панели

Опубликовано:

Добрый день!

 

Хочу в боковую панель встроить виджет от ВКонтакте, но в нем необходимо указывать его ширину, поэтому этот элемент всегда или больше ширины панели или меньше. Можно ли как-то получить ширину боковой панели при изменении окна, чтобы вставить ее в код виджета? Или раз виджет сам не растягивается, то ничего и не выйдет?

 

Пример кода:

 

<div id="vk_groups"></div>
<script type="text/javascript">
VK.Widgets.Group("vk_groups", {mode: 0, width: "200"}, 1);
</script>

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

Опубликовано:

что еще можно ответить на вопрос по верстке, javascript и чему угодно но только не администрирование IPB

Или раз виджет сам не растягивается, то ничего и не выйдет?

 

document.body.clientWidth ширина браузера.

document.body.clientHeight высота браузера.

Опубликовано:
  • Автор

Спасибо, вписал ширину как 0.21 * document.body.clientWidth, так стало получше, но все равно соотношение боковой панели к основному окну не такое и постоянно меняется. Можно ли как-то получить ширину именно боковой панели? Так было бы правильнее...

 

А вообще вопрос стоит еще и в возможности сделать этот элемент тоже резиновым, т.е. можно ли без правки кода форума получать события изменения размера браузера и автоматически перегружать данный элемент?

Опубликовано:

Вы же не в первый день на форуме :(

Вчера тему переносила, сегодня опять :(

 

Можно жестко зафиксировать ширину сайдбара на форуме (пример здесь) и сделать такую же ширину или на 2px меньше (для контуров) у окна виджета вконтакте.

Встраивала здесь, но отвратный сине-сиреневый цвет виджета нам не подходит.

Опубликовано:
  • Автор

@Fisana, да, признаю, мой косяк, прошу прощения...

 

Жестко фиксировать сайдбар совсем не хочется, но как показали поиски в инете, есть, по идее, методы, позволяющие получить ширину контейнера, но до конца я так и не разобрался. Вы не можете подсказать хотя бы id элемента сайдбара, ширину которого мне нужно найти?

 

P.S. Как ни странно, но цвет виджета практически один в один со стандартным скином :)

Опубликовано:

ipb_styles.css

#index_stats

Ширина сайдбара по дефолту задается в процентах. И она должна быть согласована с шириной в div#categories

Опубликовано:
  • Автор

Нашел, 22%, но если ставить виджету 22% от ширины окна, то он становится шире сайдбара, да и при разном разрешении экрана он скачет по ширине относительно сайдбара. Значит, мало взять 22%, нужна какая-то более сложная формула, чтобы вычислить ширину...

Опубликовано:

Единственный способ – это фиксация сайдбара и ширины виджета. Иначе при разном разрешении все равно будет пляска.

При фиксации придется убрать % у категорий, но сделать правый отступ примерно такой

margin-right: 1.5%

 

Хотя, если попробовать виджету 100% поставить? Не впишется в ширину сайдбара?

Опубликовано:
  • Автор

Хотя, если попробовать виджету 100% поставить? Не впишется в ширину сайдбара?

Пробовал с самого начала - не работает вообще, поэтому и хочу вычислить ширину сайдбара...

Ладненько, я еще покопаюсь, может найду способ.

Создайте аккаунт или войдите в него для комментирования

Сейчас на странице 0

  • Нет пользователей, просматривающих эту страницу.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.