Перейдите от использования иконки fontawesome к изображению - PullRequest
Новая
       8

Перейдите от использования иконки fontawesome к изображению

0 голосов
/ 23 марта 2019 
<script>
var today = new Date();
var hourNow = today.getHours();
var greeting;
var icon;

if (hourNow < 12) {
    greeting = "Good Morning";
    icon = "coffee";
} else if (hourNow < 20) {
    greeting = "Good afternoon!";
    icon = "sun";
} else if (hourNow < 24) {
    greeting = "Good evening";
    icon = "moon";
} else {
    greeting = "Welcome";
}

document.getElementById("col-1").innerHTML = "<h3>" + greeting + " </h1>";

document.getElementById("icon").innerHTML =
'<i class="fas fa-' + icon + '" aria-hidden="true"></i>';

</script>

Это код, который я использую выше - имя значка добавляется после "fas fa-". Как я могу не использовать шрифт awesome и просто вместо этого отображать изображение для разных времен дня?Спасибо

1 Ответ

0 голосов
/ 23 марта 2019

Замените URL-адреса изображениями по вашему выбору: 

if (hourNow < 12) {
    greeting = "Good Morning";
    icon = "https://picsum.photos/50";
} else if (hourNow < 20) {
    greeting = "Good afternoon!";
    icon = "https://picsum.photos/50";
} else if (hourNow < 24) {
    greeting = "Good evening";
    icon = "https://picsum.photos/50";
} else {
    greeting = "Welcome";
}

document.getElementById("col-1").innerHTML = "<h3>" + greeting + " </h3>";

document.getElementById("icon").innerHTML = `<img src=${icon} alt="">`;

Также исправьте закрывающий тег вашего заголовка.

...