JavaScript — WebNoob.ru

Введение в анимацию на веб-сайтах: основы CSS и JS анимации

Анимация играет важную роль в веб-дизайне, делая интерфейсы более динамичными и привлекательными. В это введение мы рассмотрим основы создания анимаций с использованием CSS и JavaScript.

Основы CSS анимации

CSS позволяет создавать простые анимации без использования JavaScript. Существует два основных способа создания анимации с помощью CSS: transition и keyframes.

Введение в анимацию на веб-сайтах: основы CSS и JS анимацииЧитать далее »

JavaScript: Проверка ширины экрана

Небольшой пост-памятка, как проверить разрешение экрана пользователя.

Естественно все уже продумано за нас и выполняется стандартными средствами:

window.matchMedia('(max-width: 480px)').matches

1	window.matchMedia('(max-width: 480px)').matches

А тек-же пример функции которая будет запускаться каждый раз, когда заданное разрешение медиа запроса достигнуто

var handleMatchMedia = function (mediaQuery) {
        if (mediaQuery.matches) {
            // если менее 480px или равное, то выполняется код между скобок 
        } else {
            // обратное условие, т.е если более 480px
        }
    },
    mdia = window.matchMedia('all and (max-width: 480px)');

// Первый запуск 
handleMatchMedia(mdia);
mdia.addListener(handleMatchMedia);

var handleMatchMedia = function (mediaQuery) {

if (mediaQuery.matches) {

// если менее 480px или равное, то выполняется код между скобок

} else {

// обратное условие, т.е если более 480px

}

mdia = window.matchMedia('all and (max-width: 480px)');

// Первый запуск

handleMatchMedia(mdia);

mdia.addListener(handleMatchMedia);

Ajax с точки зрения jquery

Оставьте комментарий / JavaScript

Jquery – одна из популярных Javascript библиотек. Она достаточно хорошо ориентирована для разработки ajax-приложений. При этом код получается очень компактным.
Я рассмотрю 3 подхода из множества возможных:
1. Стандартный, через $.post и $.get
2. Загрузка данных в элемент через $.load
3. Подгрузка скрипта с сервера с помощью getScript.

Ajax с точки зрения jqueryЧитать далее »

Установка nodejs npm и vue-cli в Ubuntu 18.10

Оставьте комментарий / JavaScript, Linux / JavaScript, js, linux, nodejs, npm, Vue

//установка актуальной версии nodejs

sudo apt-get install nodejs

//установка актуальной версии package manager

sudo apt-get install npm

//проверка версии nodejs

nodejs -v

//проверка версии npm

npm -v

cd /dev/vue-project

//страница проекта vue-cli — https://cli.vuejs.org/

//установка актуальной версии vue-cli

sudo npm install vue-cli -g

//инициализация нового проекта в (директории&nbsp;vue-project)

vue init webpack-simple

//установка актуальной версии nodejs

sudo apt-get install nodejs

//установка актуальной версии package manager

sudo apt-get install npm

//проверка версии nodejs

nodejs -v

//проверка версии npm

npm -v

cd /dev/vue-project

//страница проекта vue-cli — https://cli.vuejs.org/

//установка актуальной версии vue-cli

sudo npm install vue-cli -g

//инициализация нового проекта в (директории vue-project)

vue init webpack-simple

JavaScript: методы имитации и события html форм

Оставьте комментарий / JavaScript / JavaScript, js

Для формы и различных ее элементов определен ряд специфических событий. С этими событиями связаны методы – имитаторы событий.

Событие	HTML-атрибут (не рекомендовано)	Поддерживающие элементы форм	Описание	Метод имитации
focus	onFocus	практически все *	Получение элементом фокуса (щелчок мышью на элементе или очередное нажатие клавиши табуляции)	focus()
blur	onBlur	практически все	Потеря текущим элементом фокуса, т.е. переход к другому элементу. Возникает при щелчке мышью вне элемента либо нажатии клавиши табуляции	blur()
change	onChange	практически все	Изменение значений элемента формы. Возникает после изменения значения элемента и последующей потери фокуса, т.е. после события blur
select	onSelect	input, textarea	Выделение текста в текущем элементе	select()
submit	onSubmit	form	Отправка данных формы (щелчок по кнопке типа submit или нажатие на Enter)	submit()
reset	onReset	form	Сброс данных формы (щелчок по кнопке типа reset)	reset()

JavaScript: методы имитации и события html формЧитать далее »

Javascript: Функции, параметры и аргументы функций

Оставьте комментарий / JavaScript / JavaScript, js

Именованные функции (FunctionDeclaration)

/*
функция sum
нормально отработает
*/
var a = sum(2,2)

function sum(x,y) {
   return x+y
}

функция sum

нормально отработает

var a = sum(2,2)

function sum(x,y) {

return x+y

}

Javascript: Функции, параметры и аргументы функцийЧитать далее »

Javascript: работа с массивом (методы массива)

Оставьте комментарий / JavaScript / JavaScript, js

new Array
.length
.join
.concat
.push
.pop
.unshift
.shift
.reverse
.splice

Javascript: работа с массивом (методы массива)Читать далее »

JavaScript: преобразование типов для примитивов

Оставьте комментарий / JavaScript / JavaScript, js

Всего есть три преобразования:

Строковое преобразование.
Численное преобразование.
Преобразование к логическому значению.

JavaScript: преобразование типов для примитивовЧитать далее »