<MyRusakov.ru />

Создание крупного проекта на Java с нуля

Создание крупного проекта на Java с нуля

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

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

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

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

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

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

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

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

Каким движком Вы предпочитаете пользоваться?

Показ случайной цитаты в JavaScript

Показ случайной цитаты в JavaScript

Сегодня я хочу показать Вам скрипт, который позволяет выводить в любой блок на странице сайта какую-либо случайную цитату. Хочу отметить, что я уже писал статью о том, как сделать подобное на PHP, а теперь покажу пример на JavaScript.

Разметка страницы

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Случайная фраза на JavaScript</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div id="random-phrase">
        <div id="phrase"></div>
        <div id="author"></div>
    </div>
    <button id="next-quote">Следующая</button>

    <script src="random.phrase.js" defer></script>
</body>
</html>

JavaScript код

var quotes = [
    [
        "Благородные люди, друг друга любя,      \
        Видят горе других, забывают себя.        \
        Если чести и блеска зеркал ты желаешь, — \
        Не завидуй другим, — и возлюбят тебя.",

        "Омар Хайям"
    ],

    [
        "Добродетель мудрецов напоминает собой путешествие в дальннюю страну \
        и восхождение на вершину: идущие                                     \
        в дальнюю страну начинают свой путь с первого шага;                  \
        восходящие на вершину начинают с подножия горы.",

        "Конфуций"
    ],

    [
        "Если вы хотите успеха, а готовитесь к поражению, то вы получите как раз то, к чему готовитесь.",

        "Флоренс Шин"
    ],

    [
        "Мы – рабы своих привычек. измени свои привычки, изменится твоя жизнь.",

        "Роберт Кийосаки"
    ]
];

document.getElementById("next-quote").addEventListener("click", function() {
    
    // выбираем случайную фразу из массива
    // данные в массив могут попадать и через api
    var quote = quotes[ Math.floor( Math.random() * quotes.length ) ];

    // цитата
    var phrase = document.querySelector("#phrase");
    
    // автор
    var author = document.querySelector("#author");

    phrase.innerHTML = quote[0]; 
    author.innerHTML = quote[1];   
});

Стили для цитат

#random-phrase {
  margin: 1px auto;
  position: absolute;
  padding: 15px;
  font-size: 1.3em;
  font-style: italic;
  border: 1px solid #ddd;
}

#random-phrase #phrase {
  text-align: left;
}

#random-phrase #author {
  text-align: right;
}

#next-quote {
  padding: 5px 10px;
  border: 1px solid #ddd;
}

Вот так можно создать виджет для вывода случайной цитаты на сайте.

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

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

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

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

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

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

  1. Кнопка:

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

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

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

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

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

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