Autoprefixer "browsers" option is deprecated in v9, produces warnings
почему этот пакет требует к себе так много внимания, записываясь аж в package.json
If you want to reduce config files in project root, you can specify browsers in package.json with browserslist key
const el = document.querySelector('.mmm');
- находит элемент, а el.scrollHeight
- находит высоту этого блока. Вот Вам пример наглядный: jsfiddle.net/4xcruLgo - в блок выводит высоту 200 как и указано в css.const el = document.querySelector('.mmm');
console.log(el.scrollHeight);
window.scrollTo(0, el.scrollHeight);
, то в консоле увидите размер блока. Кусок кода, который я Вам написал, прекрасно работает, а какой результат от этого действия window.scrollTo(0, el.scrollHeight);
Вы ожидаете - одному богу известно. ECMAScript 5 и более ранние версии не были спроектированы с учётом модулей. Со временем разработчики нашли различные возможности симулировать модульную архитектуру на JavaScript.
<span
class="grid__img grid__img--uno"
style="background-image: url('some/url.jpg')">
</span>
.grid__img {
display: block;
width: 100%;
height: 100%;
background-color: darkslateblue;
/* NEW */
background-size: cover;
}
.grid__img--uno {
transform: translateY(20%);
clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 20% 100%);
/* NEW */
background-position: 10% 0%; /* наверно так */
}
Фрилансом занимаюсь с 2014 года и на данный момент с уверенностью могу сказать, что уже насчитвается более 100+ успешных проектов: landing page, сайты-визитки, интернет-магазины, куча работ с графическими объектами, видео на YouTube, контент менеджмент и многое другое.
clip-path: polygon(0 50%, 80% 50%, 80% 100%, 0 100%);
const cheerio = require('cheerio'); // npm install cheerio
const request = require('request'); // npm install request
const URL = 'https://www.instagram.com/p/Bq8MmN2hi9B/?hl=en'; // Video URL
request(URL, function (error, response, body) {
/*
...
Error Handling Here
...
*/
const $ = cheerio.load(body);
const videoTag = $('meta[property="og:video"]').attr('content'); // through meta tag
/*
Through video tag
Wait until document has been completely loaded
then: const videoTag = $('.tWeCl').attr('src');
*/
console.log(videoTag); // console output: https://instagram.fhen1-1.fna.fbcdn.net/vp/c59dc1712ed9a3386fecae951422e602/5C0B1BF2/t50.2886-16/47059203_507364433101104_5625153989382242304_n.mp4
});
<div class="_5wCQW">
<video
class="tWeCl"
playsinline=""
poster="https://instagram.fhen1-1.fna.fbcdn.net/vp/a976306a61cf8e479067e8ce96af5c42/5C0A0D28/t51.2885-15/e35/46093420_372126340028280_6102722465585727755_n.jpg"
preload="none"
src="https://instagram.fhen1-1.fna.fbcdn.net/vp/018d274540902bafb43ee254174faafc/5C09F710/t50.2886-16/47786125_419033321967458_5420819962497335296_n.mp4"
type="video/mp4">
</video>
<img
class="_8jZFn"
src="https://instagram.fhen1-1.fna.fbcdn.net/vp/a976306a61cf8e479067e8ce96af5c42/5C0A0D28/t51.2885-15/e35/46093420_372126340028280_6102722465585727755_n.jpg"
alt="">
</div>
const miniImages = document.querySelectorAll('.mini_img');
document.querySelector('.images').onclick = function(event) { // event handler for wrapper
if( event.target.classList.contains('mini_img') ) { // check if user click image element
miniImages.forEach( el => el.classList.remove('active')); // remove from all images class "active"
event.target.classList.add('active'); // add class "active" to clicked image
}
}
Например,
nunjucks.config.js:
isDebugCard = !!process.env.IM_CARD_DEBUGGER
Запускайте разработку проекта со своим флагом\переменной для работы над карточкой:
yarn start dev --env.IM_CARD_DEBUGGER
Просто разработка:
yarn start dev
Сборка проекта:
yarn build
Вы же можете гибко настроить под себя переменные окружения.