Ответы пользователя по тегу JavaScript
  • Как открывать в мобильном меню дочерние элементу по клику?

    romich
    @romich
    Frontend разработчик
    Ответ написан
    Комментировать
  • Подгрузка видео с YouTube?

    romich
    @romich
    Frontend разработчик
    По принципу изображений. Сначала же грузится маленькое изображение, а в модальном окне большое. Вот и вы поставьте на всплывание источник iframe, а на href картинку. Примерно так:
    <a class="video" href="картинка_или_скриншот_видео.jpg">
       <iframe src="https://www.youtube.com/embed/o6rBK0BqL2w" frameborder="0" allowfullscreen></iframe>
    </a>
    Ответ написан
    Комментировать
  • Как сделать такой калькулятор?

    romich
    @romich
    Frontend разработчик
    На счет SVG не знаю, но я бы сделал как систему рейтинга на CSS. Там при наведении меняется бэкграунд, а в вашем случае при изменении значения в инпуте. Только рейтинг можно без js сделать, у вас немного добавить нужно.
    Пример 1: codepen.io/andreas_pr/pen/rxkpB
    Пример 2: codepen.io/michaelord/pen/mDfaj
    Ответ написан
    Комментировать
  • Как реализуется такое меню?

    romich
    @romich
    Frontend разработчик
    Я, конечно, код вам расписывать не буду здесь, но смысл очень простой. Там стоит по скроллу раздавание классов. То есть, опускаемся на 50 пикселей, получаем дополнительный класс на меню, у которого стоит изменение бэкграуна. Потом просто добавляются и убираются активные классы элементам меню (в зависимости от того, насколько вниз опустилась страница). На каждом дополнительном классе стоит свой css.

    jQuery(document).ready(function() {
        jQuery("#scrollup").mouseover(function() {
            jQuery(this).animate({
                opacity: .65
            }, 100)
        }).mouseout(function() {
            jQuery(this).animate({
                opacity: 1
            }, 100)
        }).click(function() {
            $("html, body").animate({
                scrollTop: "0px"
            });
            return !1
        });
        jQuery(window).scroll(function() {
            0 < jQuery(document).scrollTop() ? jQuery("#scrollup").fadeIn("slow") : jQuery("#scrollup").fadeOut("slow")
        })
    });

    #scrollup {
        position: fixed;
        width: 35px;
        height: 35px;
        right: 20px;
        bottom: 40px;
        display: none;
        cursor: pointer;
        background-repeat: no-repeat;
        background-position: -3px -76px;
    background-image: url('data:image/png;base64....)

    Это пример плавного появления кнопки наверх, когда нужно. Здесь все реализовано по такому же принципу для классов меню. У самого меню изначально стоит фиксированная позиция, и ей просто добавляется дополнительный класс, у которого изменяется фон.
    Ответ написан
    Комментировать
  • Кто-нибудь знает на чем сделана такая штука?

    romich
    @romich
    Frontend разработчик
    Да, слайдер с кастомной пагинацией. Такие вещи легко решаемы тем же bxSlider
    Ответ написан
    Комментировать
  • Как подвинуть в данном случаи border у input?

    romich
    @romich
    Frontend разработчик
    немного в другое, это в какое?
    Вы можете к примеру добавить padding-bottom: 10px, следовательно border будет ниже на 10px
    Ответ написан
    2 комментария