• Как позиционировать элементы по кругу?

    @nikfakel
    Веб-разработчик
    Для начала я бы определил границы применяемости: что, например, будет, если видео будет 1000. Значит сразу показываем только несколько, остальные доступны по ссылке. В таком случае можно вообще расположить 10 картинок, обозначающие видео, по кругу через position: absolute. Но, очевидно, для универа такое не подойдет.

    Пусть тогда нам надо расположить от 6 до 20 картинок по кругу (меньше 6 - круг будет не очень-то круглый, больше 20 - картинки слишком мелкие). В таком случае просто рассчитываем через JS местоположение и указываем его через position:absolute.
    Структура HTML:
    <div id="wrap">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    <img src="/">
    </div>

    CSS просто чтобы было наглядно сразу посмотреть:
    #wrap {position: absolute; }
    #wrap img {width: 30px; height: 30px; background:#333; position: absolute; }

    и, собственно, сам скрипт на JS и jQuery:
    var num = 20; // Число картинок
    var wrap = 400; // Размер "холста" для расположения картинок
    var radius = 200; // Радиус нашего круга
    
    $(document).ready(function() {
      for (i=0;i<num; i++){
        var f = 2 / num * i * Math.PI;  // Рассчитываем угол каждой картинки в радианах
        var left = wrap + radius * Math.sin(f) + 'px';
        var top = wrap + radius * Math.cos(f) + 'px';
        $('#wrap img').eq(i).css({'top':top,'left':left}); // Устанавливаем значения каждой картинке
      }
    });

    Ну и вам, наверно, надо будет еще добавить функцию для определения числа картинок. Ну и при клике на картинку открывается видео (это уже как вы сами решите, можно и модальное окно).
    Ответ написан
    1 комментарий
  • Как сделать меню второго уровня битрикс?

    @haramba
    Почему вопросы о про битрикс такие тупые?
    Upd: посмотрел скриншот, вам нужно в разделе галерея создать меню типа left скорее всего.
    Тип меню второго уровня можно посмотреть, в параметрах компонента в режиме правки.

    Изначальный ответ
    Типы меню умеете создавать?
    Нужно использовать отдельный тип, напр. left для второго уровня меню.
    Далее, пусть структура
    /catalog/
    /catalog/category/
    ...
    /about/
    /about/contacts/
    ...

    Где /catalog/ и /about/ ссылки первого уровня меню.
    Тогда в этих разделах нужно создать меню типа left, заполнить нужные пункты.
    В шаблоне сайта, для компонента bitrix:menu есть параметр "тип меню для других уровней", туда указать left.
    В шаблоне компонента menu соответственно обрабатывать новые данные.
    Ответ написан
    1 комментарий
  • Отображение блока при наведении CSS?

    FreeMan94
    @FreeMan94
    Frontend developer
    vertical-align: top для .content
    Для инлайн-блоков всегда нужно указывать vertical-align
    Ответ написан
    1 комментарий
  • Где учиться UI/UX, веб дизайну?

    webinar
    @webinar
    Учим yii: https://youtu.be/-WRMlGHLgRg
    Задавал такой же вопрос тут Где найти пример идеального UX/UI?
    Из реально полезного:
    https://www.nickkolenda.com/user-experience/
    babich.biz
    https://events.yandex.ru/lib/talks/546/
    Так же советую почитать книги по психологии потребителя. Что бы понять как работают мозги масс.
    Ответ написан
    Комментировать