Добавить форму "сердце" в html/css + код JS добавить в избранное
Любви и кода- джунам из народа
Ах эти: "made with ♥ by bla bla bla"
Мода как говорится, диктует. И сейчас все чаще можно встретить данную фразу ( сделано с любовью...) на веб-сайтах, в подписи футера, или в шапке .
Но не все браузеры и системы могут поддерживать данную кодировку , и вместо формы жопки сердца , вы увидите лишь набор символов.
Предлагаю исправить ситуацию, написав данную няшную фигуру на html/css, чтобы она рендерилась вне зависимости от системы. А бонусом допишем пару строк JS, для функции "добавить в избранное"
<div class="wrapper">
<div class="heart"></div>
</div>
.heart {
width: 25px;
height: 25px;
background-color: blue;
transform: rotate(45deg);
}
.heart::before,
.heart::after {
content : '';
display: block;
width: 25px;
height: 25px;
background-color: blue;
border-radius: 50%;
position: absolute;
}
.heart::before {
top: -25px;
left: 0;
}
.heart::after {
top: 0;
left: -100px;
}
const addToFavourites = document.querySelector('.heart')
addToFavourites.addEventListener('click', function() {
addToFavourites.classList.toggle("activeHeart");
Бонус для uni
Для любителей юникода - html коды символов сердца:
Мы готовы взяться за самый нестандартный проект и довести его до абсолютной любви к Вашему бренду!
Создавай! Продвигай! Продавай!
Ремарк. Медиа групп | Современное рекламное агентство
+7 (995)448-02-28 | [email protected] | remarkmedia.ru