Всплывающий баннер через заданное время (JS+HTML+CSS)

Всплывающий баннер через заданное время (JS+HTML+CSS)

Небольшой самописный выскакивающий баннер на сайте. Появляется через определенное время в заданном месте. После, для дополнительного привлечения внимания, делает эфект bounce (подпрыгивание).

Смотреть демо

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


	

	#bounce {
		bottom: -500px;
		left: 20px;
		padding-top: 10px;
		position: fixed;
		z-index: 9999;
	}

	#bounce_close {
		background: rgba(0, 0, 0, 0) url("images/bounce-close.png") no-repeat scroll center center;
		cursor: pointer;
		height: 10px;
		position: absolute;
		top: -10px;
		width: 72px;
	}

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


И добавляем файлик для запоминания кук на нужное время.



Возврат к списку