Задать вопрос
Xaski

Иван Шашков

Учусь в фронтенд
Лайки

  • Как вытащить имя файла из пути в src или data-src?

    @Asokr
    Кириллица в названии файлов - не комильфо.
    Вытащить попробуйте как нить так:
    let nameArray = document.querySelector('img').getAttribute('src').split('/');
let name = nameArray[nameArray.length - 1].split('.')[0]
    Ответ написан
    2 комментария
    2 комментария

  • Как сохранить пропорции путем изменения высоты при каждом изменении ширины?

    delphinpro
    @delphinpro Куратор тега CSS
    frontend developer
    В ожидании aspect-ratio: все «хаки» для пропорцион...
    Ответ написан
    Комментировать
    Комментировать

  • Как сохранить пропорции путем изменения высоты при каждом изменении ширины?

    Ankhena
    @Ankhena Куратор тега CSS
    Нежно люблю верстку
    Либо хаком с паддингом либо задавать размеры в vw
    https://jsfiddle.net/Ankhena/cLhxv7eq/
    Ответ написан
    1 комментарий
    1 комментарий

  • Как сделать плавное появление блока при наведении на другой блок?

    @daniilshitov
    Node js разработчик
    Есть много способов как это сделать, но такое не делают обычно на чистом js, это пишут на css.
    Можно в пункт меню добавить блок который вы хотите показывать, назовем его ".block" сделать ему допустим высоту 0, и при наведение делать ему его нормальную высоту через ховер - li:hover .block{height: 100px;}(так например). Чтобы было с анимацией добавим свойство .block transition: height 1s; и тем самым высота будет анимироваться. Держи код для примера))
    ul{
			display: flex;
		}
		li{
			cursor: pointer;
		}
		li:hover .block{
			height: 100px;
		}
		.block{
			background: black;
			width:100px;
			height: 0px;
			transition: height 1s;
		}
	</style>
	<ul>
		<li>
			<p href="">шашлыки</>
			<div class="block">	</div>
		</li>
		<li><p href="">шашлыки</></li>
	</ul>
</body>
    Ответ написан
    3 комментария
    3 комментария

  • Как резиново сверстать этот макет?

    approximate_solution
    @approximate_solution
    JS Developer. Angular\React\Vue\Ember
    Задаете всё в процентах, текст и картинки можно уменьшить пропорционально ширине окна браузера с помощью vw

    Вопрос,
    не прибегая к медиа-запросам

    Блоки которые не должны быть на мобильных тоже будете скрывать без медиа-запросов?)

    Не нужно резину сводить к абсолюту, так как резиновая верстка чаще всего используется в совокупности с адаптивом. Без медиа-запросов, если у вас более-менее сложная верстка сейчас никуда.
    Ответ написан
    Комментировать
    Комментировать

  • Почему при очень низком разрешении (320x240px) сайт отображается только на часть окна?

    @66demon666
    По навыкам джун - по факту безработный
    Очевидно, что-то (блок со словами) вылезает и растягивает экран.
    Ответ написан

  • Почему не отображается png без live server?

    @strelok011
    Немного дополню предыдущего комментатора:
    1. если ссылка начинается с "/" - это значит "начать с корня сайта (или диска). например ссылка вида /images/image.png будет искаться либо по адресу site.ru/images/image.png, а локально - относительно того раздела на винте (c:/images/image.png), где находится файл html. При этом не будет браться в расчет путь к каталогу, где находится html. Ссылка получится "абсолютной".
    2. если ссылка будет без дроби вначале вида "images/image.png" - путь к изображению будет строиться от места нахождения файла html. Например: файл лежит в каталоге "c:/work/site/index.html", тогда рядом с ним должен находиться каталог images с картинкой, и браузер будет открывать картинку по следующему пути: "c:/work/site/images/image.png".
    Ссылка без дроби вначале сработает аналогично "./images..."
    точка с дробью принудительно указывает на текущий каталог, в котором лежит файл html. Ссылка получится "относительной" (т.е. будет строиться относительно местонахождения html файла)

    live в редакторе позволяет имитировать работу на сайте и подставляет корневой каталог от местонахождения файла html. Если будет более сложная структура - и live может не помочь, если будете так ссылки выстраивать. Для локальной верстки используйте только относительные ссылки. При необходимости обратиться в соседний по уровню вложенности каталог ссылка может начинаться с "../", что укажет браузеру необходимость подняться на один уровень вложенности выше.
    Ответ написан
    1 комментарий
    1 комментарий

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

    Adamos
    @Adamos
    Практика. Нужен опыт решения конкретных задач средствами языка.
    Фреймворки, паттерны и прочая архитектура не может изучаться на пустом месте, все это нужно цеплять на опыт.
    Говнокод, который решает задачу, лучше, чем красивая архитектурка, списанная с учебника.
    Когда понимаешь, как можно решать - можешь оценить качество решений. Без этого понимания будешь смотреть, как баран, и изобретать карго-культы.
    Ответ написан
    1 комментарий
    1 комментарий

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

    FanatPHP
    @FanatPHP
    Чебуратор тега РНР
    На самом деле надо качать Лару а ещё лучше - Симфони.
    Только не тупо зазубривать, а пытаться понять, почему там так сделано. Это и будет теми самыми примерами.
    И да - не Лару точно. Потому что там очень много магии которая полезна тем кто понимает как она работает и очень вредна для тех кто учится.

    И вот изучая нормальный фреймворк ты как раз и будешь учиться примерам хорошего кода.
    Начать можно с этой хрестоматийной статьи https://symfony.ru/doc/current/introduction/from_f...
    А потом переключаться на https://github.com/symfony/demo

    Честно говоря, я не очень понимаю, что ты имеешь в виду под "знаниями чистого пыха".
    Чисты пых - это синтаксис, учится за две недели.
    А остальное - это уже программирование, общее для любых языков и фреймворков. Отладка, репортинг ошибок, профайлинг, оптимизация, структурирование кода, олгоритмы.

    И кстати я совсем забыл. У нас же есть гений в своем отечестве, Дмитрий Елисеев. На фоне бесчисленных неграмотных выскочек типа хаудихи или, прости господи, руселлера, это реально человек который знает, о чем говорит.
    И - что гораздо реже случается - умеет донести эти знания до аудитории.
    И насколько я понимаю, твой уровень уже должен позволять в принипе понимать, о чем он говорит.
    В общем начать можно отсюда, https://elisdn.ru/blog/113/psr7-framework-http
    и дальше остальные материалы.
    Ответ написан
    8 комментариев
    8 комментариев

  • Как сверстать подобный слайдер в виде роад карты?

  • Как подключить html к html?

    @V0vash
    Логичным решением будет использовать сборщик( например gulp)
    • что даст возможность собирать scss/sass/less
    • "подключать html к html", например при помощи gulp-rigger
    • собирать js
    • прочие радости


    для этого придется написать таск для gulp 
    gulp.task('html', function () {
    gulp.src('src/*.html') //Выберем файлы по нужному пути
        .pipe(rigger()) //Прогоним через rigger
        .pipe(gulp.dest('dist/')) //Выплюнем их в папку build
        .pipe(browserSync.reload({stream: true})); //И перезагрузим наш сервер для обновлений
});


    и => ваш собираемый html будет выглядеть так 
    <!DOCTYPE html>
<html>
<head lang="ru">
    <meta charset="UTF-8">
    <title>Пум-пум</title>
</head>
<body>
    //= template/header.html

    <section class="content">
        Content
    </section>
    
    //= template/footer.html
</body>
</html>


    стоит заметить что при использовании browsersync страница будет обновляться при изменении стилей и html templat'ов
    Ответ написан
    Комментировать
    Комментировать