.nav {
background: #f00;
width: 200px;
height: 150px;
overflow-y: scroll;
}
.subnav {
background: #00f;
position: absolute;
left: 200px;
top: 16px;
width: 200px;
}
class Dropdown() {
constructor(selector) {
this.$el = document.querySelector(selector);
}
toggle(cls) {
this.$el.classList.toggle(cls);
}
}
class Nav extends Dropdown {
constructor(selector) {
super(selector);
this.$btn = this.$el.querySelector('.nav-button');
this.$btn.addEventListener('click', this.toggle.bind(this, 'nav_open'));
}
}
class Menu extends Dropdown {
constructor(selector) {
super(selector);
this.$btn = this.$el.querySelector('.menu-button');
this.$btn.addEventListener('click', this.toggle.bind(this, 'menu_open'));
}
}
new Nav('.nav');
new Menu('.menu');class Component {
constructor(element) {
this.element = element;
this.button = this.element.find('.button');
this.bindListeners();
}
onButtonClick() {
alert();
}
bindListeners() {
// Вариант 1
this.button.addEventListener('click', () => {
this.onButtonClick()
})
// Вариант 2
this.button.addEventListener('click', this.onButtonClick.bind(this))
}
}
.photo-layout {
display: flex;
flex-flow: row wrap;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}
.photo-layout > div {
width: auto;
flex: 1;
margin: 1rem;
}var button1Active = false;
var button2Active = true;
var button3Active = false;
function buttonActive(btn_name, btn_active) {
$(btn_name).on('click', function(){
btn_active = !btn_active;
$(this).toggleClass('button_active', button1Active);
}).toggleClass('button_active', button1Active);
}
buttonActive('.button_1', button1Active);
buttonActive('.button_2', button2Active);
buttonActive('.button_3', button3Active);
remove() {
this.arr = this.arr.filter( button => button !== this.active)
}remove<button @click="remove()">Remove active button</button>
background: linear-gradient(45deg, #000 90%, #f00 10%);
(1.5625rem - 1rem) *
Где золотая середина?
ноутбука с HD-разрешением, а у другого 4к монитор повернутый вертикально.
Прелоадеры
3. Прелоадеры и критический css вместе не могу существовать?
