Як поміняти курсор на сайті

Сайти, які мають привабливий зовнішній вигляд, користуються великою популярністю у відвідувачів. Щоб поліпшити вигляд ресурсу, їх власники зазвичай повністю або частково змінюють дизайн. Але додавання нових барвистих елементів для оформлення сторінок, на жаль, займає багато часу. Швидким способом заволодіти увагою відвідувачів ресурсу є заміна звичного курсора на невелике зображення. Для установки такого елемента на сайті потрібно виконати кілька нескладних дій.
Як поміняти курсор на сайті

Вам знадобиться

  • - власний сайт
  • - мати хоча б початкові знання HTML
  • - знати, де знаходиться код CSS на сайті

Інструкція

1
Спочатку скачайте картинку, яка буде замінювати покажчик на сайті. Зображення поширених графічних форматів (.jpg, .jpg, .jpeg, .jpg та ін.) Для цієї мети не підійдуть.
2


Для заміни покажчика потрібна картинка в форматі .cur або .ani. Щоб отримати таке зображення, знайдіть в інтернеті спеціально призначені для курсорів картинки. Розширення .cur характерно для статичних зображення, а .ani - для анімованих. Збережіть на комп`ютер вподобаний файл.
3
Але, щоб поміняти покажчик, зовсім не обов`язково брати готове зображення. Якщо ви хочете зробити картинку самостійно, то скористайтеся однією зі спеціальних програм для створення курсорів або конвертації форматів графічних файлів.
4
Залийте зображення для курсора на сайт. Потім в коді ресурсу знайдіть тег і внесіть в нього такі зміни:

замість записи "images / 1.ani" позначте шлях до залитої на ваш сайт зображенні.



5
Якщо ви хочете, щоб курсор при наведенні на посилання був у вигляді однієї картинки, а при знаходженні в області відсутності посилається елемента - мав вигляд іншого зображення, то краще для зміни покажчика використовувати CSS. Щоб зробити такі перетворення, спочатку залийте на сайт ще один файл з розширенням .cur або .ani.
6
Потім в CSS вашого сайту зробіть запис "body {cursor: url ( `1.ani`) -}", Вказавши замість "1.ani" шлях до залитого на сайт основного зображення для курсора. Цей код додає властивість змінювати курсор на зазначену картинку до тегу , в якому прописується вміст всіх сторінок ресурсу.
7
Потім напишіть в CSS рядок "a {cursor: url ( `2.ani`) -}", замінивши "2.ani" на шлях до залитого на ресурс зображенню курсору, яке повинно виникати при наведенні покажчика на посилання. Зроблений запис дозволяє замінити курсор на відповідну картинку при попаданні покажчика на будь-яке посилання на сайті, так як вносить зміни в властивість тега .


Увага, тільки СЬОГОДНІ!


Оцініть, будь ласка статтю
Всього голосів: 112
Увага, тільки СЬОГОДНІ!