Спасибо большое за твои труды. Привет из Запорожья. Твой канал уже давно стал основным источником знаний по верстке. С днем рождения. Успехов в развитии канала и всего наилучшего.
Вадос, с Днём Рождения! Желаю тебе здоровья и жизни без тревог во всех смыслах. П.С. Правую руку нужно беречь. Как говорил один мой бывший коллега из Харькова: «береги пальцы с молоду, в старости пригодятся».
С днюшкой, контент огонь. А нету в планах сделать такой же свой простой слайдер только на JS ? С возможностью листания слайдов мышкой и пальцем если в режиме эмуляции мобилки. И еще не плохо было бы сделать отображение количества страниц такой шкалой прогресса - круг с заполнением цветом. Или может сделать разбор какого то слайдера которым пользуешься ты с акцентированием внимания на проблемах которые я ниже описал. А то для начинающего даже самые простые слайдеры это жесть, я вот пробовал 3 слайдера, свайпер вообще не смог запустить, а слик и тайни.жс вроде норм но там для вывода текущего слайда какие то непонятные цифры они отдают, приходится свою ф-ю писать, а особенно не понятно в слике на первом слайде, а в тайни на последнем, если на слайде есть кнопка на нее нельзя нажать, и я пока нигде не нашел как это пофиксить уже весь мозг сломал. У меня есть модуль слайдера с курса по JS, очень простой но там нету возможности листать мышкой и пальцем, а прикрутить их это тот еще квест для меня.
У меня на работе только в прошлом году разрешили гриды использовать а им уже сто лет в обед. Так что диалогов и шоуМодалов я только лет через пять дождусь)
Ты конечно меня извини, но по скроллу ну ты и наколхозил) Лови лайфхак: body:has(dialog[open]) {overflow: hidden;}. Все это легко решается через псевдокласс :has. Т.е. когда отрибут open есть в теге dialog будет происходить блок скролла, соответственно когда нет - то скролл появляется. И все решение двумя строчками в css)
@@dmitriroben1101 В popup нет backdrop и открывается оно при помощи другой функции. У них различные предназначения. А для саморазвития ищи в Google. Да и сам Js-код можно написать по-другому - в видео много лишнего. Не можешь писать, так скинь в телегу исходный код, как делают многие.
Я не удаляю коменты, только баню, если там откровенно дичь написана, обычно она идет с оскорбления, но если ты можешь писать, значит я вообще не трогал твои коменты и вообще хз о чем ты )
@@vadymprokopchuk Тогда извини за наезд про удаление. Там было написано, что у тебя не popup, модальное окно в видео рассматривается. И если не можешь печатать, то скидывай исходники в телегу, а люди сами разберутся - надо ли печатать с экрана или сразу исходник загрузить и просто следить за твоими объяснениями.
если диалогов больше чем 1, можно такой js код юзать: const dialogs = document.querySelectorAll('.dialog'); const openModals = document.querySelectorAll('.open-modal'); const closeModals = document.querySelectorAll('.close-modal'); openModals.forEach((button, index) => { button.addEventListener('click', () => { dialogs[index].showModal(); // showModal() is inside method for Dialog document.body.classList.add('scroll-block'); }); }); closeModals.forEach((button, index) => { button.addEventListener('click', () => { dialogs[index].close(); // close() is inside method for Dialog document.body.classList.remove('scroll-block'); }); }); dialogs.forEach((dialog) => { dialog.addEventListener('click', (event) => { const isOverlayClick = event.target === dialog; if (isOverlayClick) { dialog.close(); // close() is inside method for Dialog document.body.classList.remove('scroll-block'); } }); // 'cancel' works with Dialog // in this case when we click on keyboard 'Esc' when Dialog modal is open and returns returnScroll() dialog.addEventListener('cancel', () => { document.body.classList.remove('scroll-block'); }); });
Спасибо большое за твои труды. Привет из Запорожья. Твой канал уже давно стал основным источником знаний по верстке. С днем рождения. Успехов в развитии канала и всего наилучшего.
Благодарю! Успехов в обучении
С днем рождения, благодарю за те знания которые ты даешь и за то что ты просто добрый человек, спасибо!
Спасибо, мне очень приятно
С днем рождения, красавчик !)). Спасибо за информацию, как всегда очень полезно и прикольно). Такой формат понравился даже больше.
Спасибо!!! Круто, спасибо, что отписал по формату
Да, такой формат подходит для меня как не для новичка, я узнаю у тебя новинки. Спасибо 🥰
С днем рождения! Спасибо за потрясающие уроки!
Спасибо
Вадим, с Днем Рождения!
Спасибо за ролики!
Спасибо
С Днем рождения, Вадим🎉🎉🎉 Спасибо вам преогромнейшее за ваш труд💐 Мне нравятся оба формата видео, с готовым кодом вполне нормально👍
Спасибо! и спасибо за ответ по формату
Вадос, спасибо тебе ОГРОМНОЕ за твой контент, ты делаешь БОЛЬШОЕ дело
Береги себя и свою семью !!!
Благодарю
Человечище!!! Вадим с днём рождения и большого здоровья тебе. 🎉
Спасибо!!!
Благодарю за современный код! 👍 И с прошедшей Денюхой, Вадим!! 🎂🍰.. поправляйся!)
С Днем Рождения, Вадим!!!🎉🎉🎉. Твои уроки самые лучшие!!!
Благодарю!
Вадос, с Днём Рождения! Желаю тебе здоровья и жизни без тревог во всех смыслах.
П.С. Правую руку нужно беречь. Как говорил один мой бывший коллега из Харькова: «береги пальцы с молоду, в старости пригодятся».
Спасибо))
С днём рождения! Здоровья!
С днем рождения Вадим🎉 Спасибо Тебе👍👍👍 за знания.
Спасибо!
Спасибо. И с днём рождения! 🥳🎁🎉
Спасибо !
с Днем Рождения🎉 и спасибо за качественный, интересный контент. А руке пожелаю скорейшего заживления🙃🎂🍾
Благодарю!)
Только сейчас попал на это видео, блин на скидку не попал:)))
С Днюхою прошедшей кстати!
мне подходит формат как было раньше.
С днюшкой, контент огонь.
А нету в планах сделать такой же свой простой слайдер только на JS ? С возможностью листания слайдов мышкой и пальцем если в режиме эмуляции мобилки. И еще не плохо было бы сделать отображение количества страниц такой шкалой прогресса - круг с заполнением цветом. Или может сделать разбор какого то слайдера которым пользуешься ты с акцентированием внимания на проблемах которые я ниже описал.
А то для начинающего даже самые простые слайдеры это жесть, я вот пробовал 3 слайдера, свайпер вообще не смог запустить, а слик и тайни.жс вроде норм но там для вывода текущего слайда какие то непонятные цифры они отдают, приходится свою ф-ю писать, а особенно не понятно в слике на первом слайде, а в тайни на последнем, если на слайде есть кнопка на нее нельзя нажать, и я пока нигде не нашел как это пофиксить уже весь мозг сломал.
У меня есть модуль слайдера с курса по JS, очень простой но там нету возможности листать мышкой и пальцем, а прикрутить их это тот еще квест для меня.
У меня на работе только в прошлом году разрешили гриды использовать а им уже сто лет в обед. Так что диалогов и шоуМодалов я только лет через пять дождусь)
=))))
Поздравляю с днём рождения 🎉🎉🎉
Спасибо
С Днем Рождения 🥳🎂🍾
Спасибо
Вадим,здарова) 1)Дякую за твій контент 2)Бережи себе! 3)Ну і з днюхою тебе==>щоб стояв і гроші були.Good luck🤞
Дякую )))
С Днём Рождения!
Спасибо !
С днюхой!
спасибо 🙏
С днем рождения!!!)
Спасибо!
автора обнимаю
Обнимаю
Ни в начале не показана нормальная работа (javascript отключен), ни в конце (автор увлекся и забыл), даблшот :) Ржу не могу
С Днем Рождения!
Спасибо
❤
У меня трехсменная работа, если я не попадаю на урок, как быть в этом случае?
Я имею ввиду ваш курс Основы JavaScript. JavaScript для верстальщика
Ты конечно меня извини, но по скроллу ну ты и наколхозил) Лови лайфхак: body:has(dialog[open])
{overflow: hidden;}. Все это легко решается через псевдокласс :has.
Т.е. когда отрибут open есть в теге dialog будет происходить блок скролла, соответственно когда нет - то скролл появляется. И все решение двумя строчками в css)
Какой шрифт в vs code используешь*
Вадос спасибо за видос))
круто. Но как сделать что бы модалка плавно появлялась?
.dialog {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin: 0;
width: 400px;
display: block;
opacity: 0;
visibility: hidden;
box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .8);
transition: opacity .5s ease 0s, visibility .5s ease 0s, box-shadow .5s ease 0s;
}
.dialog[open] {
opacity: 1;
visibility: visible;
}
.dialog::backdrop {
background-color: #00000000;
}
плавное появление модалки
Это тебе для развития навыков JS)))
youtube не дает js-код сохранить, где более продвинутая версия твоего кода.
А архив скинуть не судьба?
Не бережете вы себя, Юрий Венедиктович
))
лайк
У тебя в коде не popup, а модальное окно! Ты хоть разницу понимаешь между этими вещами?
оО, так объясни. Многим интересно будет
@@dmitriroben1101 В popup нет backdrop и открывается оно при помощи другой функции. У них различные предназначения. А для саморазвития ищи в Google. Да и сам Js-код можно написать по-другому - в видео много лишнего. Не можешь писать, так скинь в телегу исходный код, как делают многие.
Вітаю з Днем народження
Дякую !
Вітаю із Днем народження)
Дякую !
С критикой у тебя большие проблемы, раз способен только удалять комментарии, а не отвечать на них!!! Теперь понятно какой ты профи). Никакой)))
Я не удаляю коменты, только баню, если там откровенно дичь написана, обычно она идет с оскорбления, но если ты можешь писать, значит я вообще не трогал твои коменты и вообще хз о чем ты )
Ну ты бы хоть внимательно смотрел, с твоим комментом я ничего не делал
@@vadymprokopchuk Тогда извини за наезд про удаление. Там было написано, что у тебя не popup, модальное окно в видео рассматривается. И если не можешь печатать, то скидывай исходники в телегу, а люди сами разберутся - надо ли печатать с экрана или сразу исходник загрузить и просто следить за твоими объяснениями.
если диалогов больше чем 1, можно такой js код юзать:
const dialogs = document.querySelectorAll('.dialog');
const openModals = document.querySelectorAll('.open-modal');
const closeModals = document.querySelectorAll('.close-modal');
openModals.forEach((button, index) => {
button.addEventListener('click', () => {
dialogs[index].showModal(); // showModal() is inside method for Dialog
document.body.classList.add('scroll-block');
});
});
closeModals.forEach((button, index) => {
button.addEventListener('click', () => {
dialogs[index].close(); // close() is inside method for Dialog
document.body.classList.remove('scroll-block');
});
});
dialogs.forEach((dialog) => {
dialog.addEventListener('click', (event) => {
const isOverlayClick = event.target === dialog;
if (isOverlayClick) {
dialog.close(); // close() is inside method for Dialog
document.body.classList.remove('scroll-block');
}
});
// 'cancel' works with Dialog
// in this case when we click on keyboard 'Esc' when Dialog modal is open and returns returnScroll()
dialog.addEventListener('cancel', () => {
document.body.classList.remove('scroll-block');
});
});