πŸ”” Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

overlay.js is a dead simple jQuery plugin that shows a fullscreen loading overlay to prevent user interaction during AJAX request.

loading-overlay

Documentation

jQuery.overlay

jQuery скрипт для Π±Π»ΠΎΠΊΠΈΡ€ΠΎΠ²ΠΊΠΈ экрана Π½Π°Π»ΠΎΠΆΠ΅Π½Ρ‹ΠΌ слоСм, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ ΠΏΡ€ΠΈ ajax запросах

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ использования:

простоС использованиС

$.overlay.show(); // ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ слой $.overlay.hide(); // ΡΠΊΡ€Ρ‹Ρ‚ΡŒ слой

установка ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ΠΎΠ²

var overlay = $.overlay({     'element' : 'overlay', // сСлСктор класса Π±Π»ΠΎΠΊΠ°     'time' : 300 // врСмя Π·Π° ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ отобразится ΠΈΠ»ΠΈ скроСтся слой }); overlay.show(); overlay.hide();

Π”ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ класса слою ΠΏΠ΅Ρ€Π΅Π΄ ΠΏΠΎΠΊΠ°Π·ΠΎΠΌ, ΡƒΠ΄ΠΎΠ±Π½ΠΎ ΠΏΡ€ΠΈ ajax запросах ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ ΠΏΡ€Π΅Π»ΠΎΠ°Π΄Π΅Ρ€

var overlay = $.overlay(); overlay.show('some_class'); overlay.hide('some_class');

CSS ΠΏΡ€ΠΈΠΌΠ΅Ρ€

Π±ΠΎΠ»Π΅Π΅ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ ΠΌΠΎΠΆΠ½ΠΎ Π²Π·ΡΡ‚ΡŒ Π² demo

.overlay {     display: none;     width: 100%;     height: 100%;     position: fixed;     top: 0;     bottom: 0;     left: 0;     right: 0;     margin: auto;     z-index: 50;     background-color: rgba(0, 0, 0, 0.5); }

You May Also Like