mirror of
https://github.com/adambard/learnxinyminutes-docs.git
synced 2024-11-23 14:17:02 +03:00
Translate topic: Events and Effects (part II)
This commit is contained in:
parent
d8beb06518
commit
656ef60a39
@ -57,4 +57,46 @@ $('#btn').mousemove(onAction); // Когда переместили курсор
|
||||
$('#btn').mouseenter(onAction); // Когда навели курсор на элемент
|
||||
$('#btn').mouseleave(onAction); // Когда сдвинули курсор с элемента
|
||||
|
||||
|
||||
// Вы можете не только обрабатывать события, но и вызывать их
|
||||
$('#btn').dblclick(); // Вызвать двойной клик на элементе
|
||||
|
||||
// Для одного селектора возможно назначить несколько обработчиков событий
|
||||
$('#btn').on(
|
||||
{dblclick: myFunction1} // Обработать двойной клик
|
||||
{blur: myFunction1} // Обработать исчезновение фокуса
|
||||
);
|
||||
|
||||
// Вы можете перемещать и прятать элементы с помощью методов-эффектов
|
||||
$('.table').hide(); // Спрятать элемент(ы)
|
||||
|
||||
// Обратите внимание: вызов функции в этих методах всё равно спрячет сам элемент
|
||||
$('.table').hide(function(){
|
||||
// Сначала спрятать элемент, затем вызвать функцию
|
||||
});
|
||||
|
||||
// Вы можете хранить селекторы в переменных
|
||||
var tables = $('.table');
|
||||
|
||||
// Некоторые основные методы для манипуляций с документом:
|
||||
tables.hide(); // Спрятать элемент(ы)
|
||||
tables.show(); // Показать элемент(ы)
|
||||
tables.toggle(); // Спрятать/показать
|
||||
tables.fadeOut(); // Плавное исчезновение
|
||||
tables.fadeIn(); // Плавное появление
|
||||
tables.fadeToggle(); // Плавное исчезновение или появление
|
||||
tables.fadeTo(0.5); // Изменение прозрачности
|
||||
tables.slideUp(); // Свернуть элемент
|
||||
tables.slideDown(); // Развернуть элемент
|
||||
tables.slideToggle(); // Свернуть или развернуть
|
||||
|
||||
// Все эти методы принимают скорость (в миллисекундах) и функцию обратного вызова
|
||||
tables.hide(1000, myFunction); // Анимация длится 1 секунду, затем вызов функции
|
||||
|
||||
// В методе 'fadeTo' вторым параметром обязательно идёт прозрачность
|
||||
tables.fadeTo(2000, 0.1, myFunction); // Прозрачность меняется в течение 2 секунд до 0.1, затем вызывается функция
|
||||
|
||||
// Метод 'animate' позволяет делать более продвинутую анимацию
|
||||
tables.animate({"margin-top": "+=50", height: "100px"}, 500, myFunction);
|
||||
|
||||
```
|
||||
|
Loading…
Reference in New Issue
Block a user