(function () {
'use strict';
const myTab = function (selector, options) {
const setting = Object.assign({
// параметры по умолчанию
}, options || {});
// код логики табов
};
// Цепляем функцию плагина на глобальный объект
window.myTab = myTab;
}());
//> Инициализируем плагин
window.myTab('.my-tab-selector', {
active: 'active-item',
content: 'tab-item-content',
tabs: '.tabs',
onChange: function (tab) {
console.log('Таб переключили')
}
});
<div>
<div>CREATIIVES</div>
<div class="sub-title">
<div>S</div>
<div>U</div>
<div>B</div>
<div>-</div>
<div>T</div>
<div>I</div>
<div>T</div>
<div>L</div>
<div>E</div>
</div>
</div>.sub-title {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
gdrive-windows-x64.exe list -m 1000
All the features in WebStorm are included into PhpStorm, with full-fledged support for PHP and Databases/SQL support added on top.в сравнении пхпшторм и вебшторм у первого есть только один минус - цена.
.box:hover .box-inner{
margin-top:-360px;
position: relative;
box-sizing: border-box;
transition: all 500ms ease;
}
.box-inner{
transition: all 500ms ease;
}
При наведении происходят непонятные скачки
.box-inner завязано на его же :hover, так что когда он уезжает из-под курсора, состояние :hover теряется, элемент откатывается назад, под курсор, снова случается :hover, элемент опять едет вверх, ну и т.д. Надо смотреть :hover у элемента, который из-под курсора никуда не девается, т.е., у родительского:.box:hover .box-inner {
margin-top: -360px;
}Также, как сделать, чтобы при убирании курсора все возвращалось обратно плавно, а не резким скачком?
transition должен присутствовать у элемента вне зависимости от наличия состояния :hover:.box-inner {
transition: all 500ms ease;
}
