угловой баннер

Приветствую всех друзей и читателей – Sozdaiblog.ru!

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

Вот и сегодня я пишу этот пост в ожидании очередной дозы позитивной энергии.

То, чем в этот раз мне хотелось бы с Вами поделиться называется «угловой баннер с сюрпризом». У этой штуковины нет официального названия, поэтому, будем называть её так.

С виду это обычная угловая лента привлекающая внимание посетителей и скрывающая за собой определённую рекламную информацию спрятанную  Веб-мастером. Кто-то скажет, что таких угловых баннеров пруд пруди в Интернете. Но я готов поспорить, что такого Вы ещё не видели!

Это не просто угловая лента, она практически живая, так как реагирует на малейшее движение курсора мыши. Если не верите, то убедитесь сами.

угловой баннер

ДЕМО СКАЧАТЬ

Всем кому понравилось, могут установить такую ленту на свой сайт.

Как установить угловой баннер с сюрпризом?

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

Скачайте архив и распакуйте в удобное для Вас место. Там будет находиться некоторое количество файлов. Найдите среди них файл index.html, откройте его на редактирование любым текстовым редактором и скопируйте всё, что находится между тегами <body> </body>.

Всё что Вы скопировали Вам необходимо вставить в такой же файл и в то же место на своём сайте или блоге.

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

<img src="https://Путь к изображению/1.jpg">
<img src="https://Путь к изображению/2.jpg">
<img src="https://Путь к изображению/3.jpg">
<img src="https://Путь к изображению/4.jpg">

Далее в распакованном архиве отыщите файл forkit.js и по предыдущей аналогии закиньте его на сервер, прописав к нему путь в том же коде:

<script src="https://Путь к файлу/forkit.js"></script>

Теперь Вам необходимо найти в архиве файл CSS и перенести его содержимое в такой же файл на своём Веб-ресурсе. Если Ваш сайт, как и мой, работает на движке WordPress, то все файлы необходимые для редактирования находятся в папке Вашей активной темы оформления.

Размер и цвет всех элементов каждый сможет отредактировать самостоятельно в файле CSS.

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

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

Ну а на сегодня это всё! До новых встреч, друзья…

С уважением, Денис Черников!