как сделать, чтобы при нажатии на кнопку
$('.path-slider__item').click(function(e) {
e.preventDefault();
var btnId = $(this).attr('id');
$('[data-item]').each(function() {
$(this).css({'opacity':'1'})
if ($(this).data('item') !== btnId) {
$(this).css({'opacity':'0.5'});
}
});
});<input type="hidden" name="headline" id="form-headline-input">
<input type="hidden" name="price" id="form-price-input">function openModal(headline, price) {
var modal = $('#myModal');
// нужно добавить уникальный класс к h3 и .price
$(modal).find('.h3-modal__title').text(headline);
$(modal).find('.modal__price').text(price);
$(modal).find('#form-headline-input').val(headline);
$(modal).find('#form-price-input').val(price);
$(modal).modal('show')
}var result = $('div').sort(function (a, b) {
var contentA = parseInt( $(a).data('sort'));
var contentB = parseInt( $(b).data('sort'));
return (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
});
$('#mylist').html(result);
P.S. Хорошей практикой будет сортировка через сервер. Потому что, если данных много, то вступает в работу пагинация, чтобы запросы и ответы были не слишком большими, в таком случае сортировать контент, который только на странице, а не весь не сработает.
и последнее, я разрабатываю именно на линуксе + среда разработки в ней же, или я просто разворачиваю сервак на ней, а запросы делаю уже с основной системы, то есть винды?
VB ведь будет запущен на одном и том же компьютере => использует одну и ту же память, или речь идёт о каких-то квотах?
Такой подход необходим, или просто максимально удобен для разработки?
Т.е. может просто OpenServer с NGNX и NODE.JS для отладки и теста работоспособности будет достаточно, а потом уже с деплоем по бодаться, если вообще с этим могут быть траблы?
1) Лучше сразу изучайте препроцессоры. Для HTML - Jade(Haml/Slim), для CSS - Sass/SCSS/Less. Это такие надстройки над "языками", которые упрощают написание кода в 10 раз.
2) Используйте IDE: Webstorm (но он платный), Atom (но он не совсем IDE, а скорее улучшенный текстовый редактор, хотя его можно раскачать до IDE), Sublime (он тоже как бы платный), VS Code (бесплатный и довольно сильный). IDE будет помогать вам отслеживать и дебажить ошибки, будет автоматически подставлять модули, подсвечивать синтаксис и ещё куча вещей.
3) Используйте сборщики, для старта можно Parcel, потом можно переходить на Gulp/Webpack отдельно. Сборщики проектов будут компилировать ваш SCSS (например) в CSS, при этом с помощью autporefixer будут автоматически расставляться префиксы для всех браузеров (некоторые аттрибуты css имеют разное значение в разных браузерах).
4) Вместо JavaScript, используйте TypeScript, он более понятен для новичка, имеет встроенный линтер (это такой проверщик вашего кода), плюс требователен к типизации.
5) Используйте node.js и пакетные менеджеры - npm или yarn. Они помогут вам в подключении сторонних библиотек (например, jQuery), в их обновлении и отслеживании. В последующем, их не всегда лучше использовать для продакшн-версий проектов, иногда стоит подключать библиотеки через script теги в угоду скорости загрузки (но об этом пока не нужно думать)
<link>, их можно подключать внутри css , например:@media only screen and (max-width: 600px) {
// тут ваш код
}Лучше не использовать проценты, пиксели, вьюпорты для размеров верстки. Самый оптимальный вариант для размером: rem - это относительная величина, относительно корневого элемента. Обычно это :root и она обычно равна 16px. em не стоит использовать, так как он относителен родительского элемента.
Хорошим тоном является использование готовых фреймворков. Например: bootstrap или bulma. Обычно такие фреймворки включают в себя сброс стандартных стилей браузеров и ОС, адаптивную сетку (для каждой ширины экрана) и наборы элементов (текст, кнопки, таблицы и прочее). Все это хорошо задокументировано.
Для своих проектов, я взял за основу SCSS версию бутстрапа, убрал лишние элементы, оставил миксины (это функции внутри таблицы стилей) и использую их. Самая частый миксин: media-breakpoint - этот миксин автоматически добавляет меди-запрос не в целый код, а к конкретному элементу. Например, мне нужно, чтобы отступы у body для ноутбуков были 1rem, но для 4К были 0 - миксины в этом отлично помогают.