Контакты
Местоположение
Украина

Наибольший вклад в теги

Все теги (10)

Лучшие ответы пользователя

Все ответы (27)
  • Как отключить swiper слайдер на десктопе?

    @dennis_d
    One Love, One Front-End
    как-то так должно работать

    function initSlider() {
    new Swiper('.swiper', {
    	loop: false,
    	sped: 2400,
    	navigation:{
    		nextEl: '.swiper-button-next',
    		prevEl: '.swiper-button-prev',
    	},
    	pagination: {
    		el: '.swiper-pagination',
    		clickable: true
    	},
    	breakpoints: {
        // when window width is >= 320px
        320: {
          slidesPerView: 2,
          spaceBetween: 20
        },
        // when window width is >= 480px
        480: {
          slidesPerView: 2,
          spaceBetween: 30
        },
        // when window width is >= 1920px
        1920: {
          slidesPerView: 1,
    	    spaceBetween: 60,
    	    autoplay:false,
        }
      }
    	 
    });
    }
    
    
    function detectDevice() {
    	if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){
        // true for mobile device
        initSlider();
        
    	}else{
        // false for not mobile device
        
    	}
    }
    
    detectDevice();
    Ответ написан
    Комментировать
  • Как центрировать div в области просмотра страницы?

    @dennis_d
    One Love, One Front-End
    как всегда есть несколько вариантов решения, один из них, поместить модальное окно внутрь overlay (затемнения), которому добавить
    display: flex
    align-items: center
    justify-content: center

    это не самый лучший вариант, но если модалка одна, и больше никакого динамического контента не предвидится, то можно. 2й вариант - описан в ответе выше. только вместо fixed можно absolute.

    А чтобы скрыть прокрутку в функцию открытия нужно добавить
    document.body.style.overflow = 'hidden'
    А в функцию закрытия
    document.body.style.overflow = 'auto'
    Также можно эту конструкцию обернуть в переменную, чтобы не дублировать код, например так
    const body = document.body
    //open modal
    body.style.overflow = 'hidden'
    
    //close modal
    body.style.overflow = 'auto'
    Ответ написан
    Комментировать
  • Реализация блока?

    @dennis_d
    One Love, One Front-End
    Лучше сделай img, в данном случае это изображение, скорее контентное, чем декоративное, поэтому псевдоэлемент не совсем подойдет. Оберни img и всю текстовую конструкцию справа в отдельные обертки, а дальше уже flexbox в помощь

    Еще, как вариант, если таких блоков несколько, то соедини все подобные картинки в спрайт, добавь пустой тэг, например, span и с помощью css background добавь нужное изображение.
    Ответ написан
    3 комментария
  • Как сделать деплой собраного gulp-ом проект на гит?

    @dennis_d
    One Love, One Front-End
    В репозитории на Github необходимо создать новую ветку с именем 'gh-pages' . Перейти в Settings репозитория, пролистать страницу вниз до GitHub Pages и в настройках указать данную ветку.
    И еще в gulpfile.js нужно прописать путь, где находится скомпилированный проект, примерно так
    const gulp = require('gulp');
    const ghPages = require('gulp-gh-pages');
    
    gulp.task('deploy', function() {
        return gulp.src('./dist/**/*')
            .pipe(ghPages());
    });

    где dist - это папка с готовой компиляцией проекта
    И все заработает.
    Ответ написан
    8 комментариев
  • Как создать масив обектов?

    @dennis_d
    One Love, One Front-End
    как вариант:

    let login = document.getElementById("login");
    let password = document.getElementById("password");
    let email = document.getElementById("email");
    const vLogin = /^[a-zA-Z]{4,16}$/;
    const vEmail = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    const vPassword = /^[a-zA-Z0-9]{8,15}$/;
    let button = document.getElementById("button");
    
    
    let usersArray = [];
    
    function addUser(array) {
        vLogin.test(login.value);
        vEmail.test(email.value);
        vPassword.test(password.value);
    
        const user = {
            login: login.value,
            email: password.value,
            password: email.value,
        }
        array.push(user)
    
        login.value = '';
        email.value = '';
        password.value = '';
    }
    
    function saveUsers() {
        addUser(usersArray)
        console.log(usersArray)
    }
    
    button.addEventListener('click', saveUsers)
    Ответ написан
    Комментировать

Лучшие вопросы пользователя

Все вопросы (9)