<MyRusakov.ru />

Создание игр на Unreal Engine 5

Создание игр на Unreal Engine 5

Данный курс научит Вас созданию игр на Unreal Engine 5. Курс состоит из 12 модулей, в которых Вы с нуля освоите этот движок и сможете создавать самые разные игры.

В курсе Вы получите всю необходимую теоретическую часть, а также увидите массу практических примеров. Дополнительно, почти к каждому уроку идут упражнения для закрепления материала.

Помимо самого курса Вас ждёт ещё 8 бесплатных ценных Бонусов: «Chaos Destruction», «Разработка 2D-игры», «Динамическая смена дня и ночи», «Создание динамической погоды», «Создание искусственного интеллекта для NPC», «Создание игры под мобильные устройства», «Создание прототипа RPG с открытым миром» и и весь курс «Создание игр на Unreal Engine 4» (актуальный и в 5-й версии), включающий в себя ещё десятки часов видеоуроков.

Подробнее
Подписка

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Какая тема Вас интересует больше?

jQuery эффекты

jQuery эффекты

На этом уроке, мы рассмотрим эффекты в jQuery – это такие методы, как hide, show, toggle, slide, fade и animate.

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

<div id="test"></div>

#test {
    background:#bdfa02;
    height:100px;
    width:200px;
    position:absolute;
}

Для запуска эффектов нам потребуются кнопки с разными классами. Мы будем обращаться к каждой кнопке по названию класса и вешать на неё определенное действие.

jQuery анимация

Рассмотрим, как можно анимировать элементы на странице, изменяя их стили. Например изменим ширину у блока, прибавив к текущей ширине 150 пикселей. Создадим кнопку, при клике по которой, наш блок плавно вытянется вправо.

<button class="changeWidth">Изменить ширину</button>

По событию клик по кнопке с классом changeWidth мы запускаем функцию, внутри которой выбираем наш тестовый блок #test и применяем к нему метод animate. Метод animate изменяет CSS свойство с анимацией, делает это плавно. Он принимает на себя два параметра: объект, где мы изменяем ширину (CSS свойство) и скорость анимации. Прямоугольник может двигаться ещё медленнее, тоесть за 2 секунды он изменит свою ширину до 350 пикселей.

$(document).ready(function(){
    $(".changeWidth").click(function(){
    $("#test").animate({width: '350px'}, 2000);
});
});

jQuery скрыть / показать

Метод hide()


<button class="hideBtn">Скрыть</button>

При клике по кнопке с классом hideBtn, запускаем функцию, внутри которой выбираем наш блок и скрываем его в течении 1 секунды.

$(".hideBtn").click(function(){
    $("#test").hide(1000);
});

Метод show()

Показывает элемент на странице, который мы только-что скрыли.

<button class="showBtn">Показать</button>
    $(".showBtn").click(function(){
    $("#test").show(2000);
    });

Метод fadeout()

Плавно растворяет элемент, делая его полностью прозрачным.

<button class="fadeOut">Скрыть(fadeOut)</button>

К нашему блоку применяем метод fadeout, передавая в параметрах скорость исчезновения – 2 секунды.

$(".fadeOut").click(function(){
    $("#test").fadeOut(2000);
});

Метод fadeIn()

Плавно меняет прозрачность элемента до полной его видимости (для работы эффекта элемент должен быть изначально скрыт). Действует противоположным образом.

<button class="fadeIn">Показать(fadeIn)</button>
$(".fadeIn").click(function(){
    $("#test").fadeIn(2000);
});

У обоих методов по умолчанию, скорость проявления / растворения равна 400, поэтому в параметрах можно ничего не передавать. Все равно процесс будет происходить более-менее плавно.

Метод fadeToggle()

Если элемент скрыт, то данная функция отображает его (используя метод show). Если элемент видимый — скрывает его (используя метод hide).

<button class="fadeToggle">Переключить(fadeToggle)</button>
$(".fadeToggle").click(function(){
    $("#test").fadeToggle(1000);
});

Метод slideUp()

Плавное исчезновение элемента, за счет уменьшения его высоты. Элемент скользит вверх, теряя высоту.

<button class="slideUp">Скрыть(slideUp)</button>
$(".slideUp").click(function(){
    $("#test").slideUp();
});

Метод slideDown()

Появление элемента, за счет увеличения его высоты.

<button class="slideDown">Показать(slideDown)</button>
$(".slideDown").click(function(){
    $("#test").slideDown();
});

Метод slideToggle()

Переключает видимость элементов, используя эффект изменения их высоты.

<button class="slideToggle">Переключить(slideToggle)</button>
$(".slideToggle").click(function(){
    $("#test").slideToggle();
});

Заключение

Методы fadeOut, fadeIn и fadeToggle, элегантнее аналогичных методов, скрывают и показывают элементы.

See the Pen jQuery effects by porsake (@porsake) on CodePen.

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (0):

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.