Click below buttons to block below content area.
<div class="example-preview" id="kt_blockui_content">
...
</div>
// default
$('#kt_blockui_default').click(function() {
KTApp.block('#kt_blockui_content', {});
setTimeout(function() {
KTApp.unblock('#kt_blockui_content');
}, 2000);
});
$('#kt_blockui_overlay_color').click(function() {
KTApp.block('#kt_blockui_content', {
overlayColor: 'red',
opacity: 0.1,
state: 'primary' // a bootstrap color
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_content');
}, 2000);
});
$('#kt_blockui_custom_spinner').click(function() {
KTApp.block('#kt_blockui_content', {
overlayColor: '#000000',
state: 'warning', // a bootstrap color
size: 'lg' //available custom sizes: sm|lg
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_content');
}, 2000);
});
$('#kt_blockui_custom_text_1').click(function() {
KTApp.block('#kt_blockui_content', {
overlayColor: '#000000',
state: 'danger',
message: 'Please wait...'
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_content');
}, 2000);
});
$('#kt_blockui_custom_text_2').click(function() {
KTApp.block('#kt_blockui_content', {
overlayColor: '#000000',
state: 'primary',
message: 'Processing...'
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_content');
}, 2000);
});
Click below buttons to block modal.
<div class="modal fade" id="kt_blockui_modal_default" tabindex="-1" role="dialog" aria-hidden="true">
...
</div>
<div class="modal fade" id="kt_blockui_modal_overlay_color" tabindex="-1" role="dialog" aria-hidden="true">
...
</div>
<div class="modal fade" id="kt_blockui_modal_custom_spinner" tabindex="-1" role="dialog" aria-hidden="true">
...
</div>
<div class="modal fade" id="kt_blockui_modal_custom_text_1" tabindex="-1" role="dialog" aria-hidden="true">
...
</div>
<div class="modal fade" id="kt_blockui_modal_custom_text_2" tabindex="-1" role="dialog" aria-hidden="true">
...
</div>
// default
$('#kt_blockui_modal_default_btn').click(function() {
KTApp.block('#kt_blockui_modal_default .modal-dialog', {});
setTimeout(function() {
KTApp.unblock('#kt_blockui_modal_default .modal-content');
}, 2000);
});
$('#kt_blockui_modal_overlay_color_btn').click(function() {
KTApp.block('#kt_blockui_modal_overlay_color .modal-content', {
overlayColor: 'red',
opacity: 0.1,
state: 'primary' // a bootstrap color
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_modal_overlay_color .modal-content');
}, 2000);
});
$('#kt_blockui_modal_custom_spinner_btn').click(function() {
KTApp.block('#kt_blockui_modal_custom_spinner .modal-content', {
overlayColor: '#000000',
state: 'warning', // a bootstrap color
size: 'lg' //available custom sizes: sm|lg
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_modal_custom_spinner .modal-content');
}, 2000);
});
$('#kt_blockui_modal_custom_text_1_btn').click(function() {
KTApp.block('#kt_blockui_modal_custom_text_1 .modal-content', {
overlayColor: '#000000',
state: 'danger',
message: 'Please wait...'
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_modal_custom_text_1 .modal-content');
}, 2000);
});
$('#kt_blockui_modal_custom_text_2_btn').click(function() {
KTApp.block('#kt_blockui_modal_custom_text_2 .modal-content', {
overlayColor: '#000000',
state: 'primary',
message: 'Processing...'
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_modal_custom_text_2 .modal-content');
}, 2000);
});
Click below buttons to block this card.
<div class="card card-custom gutter-b" id="kt_blockui_card">
...
</div>
$('#kt_blockui_card_default').click(function() {
KTApp.block('#kt_blockui_card');
setTimeout(function() {
KTApp.unblock('#kt_blockui_card');
}, 2000);
});
$('#kt_blockui_card_overlay_color').click(function() {
KTApp.block('#kt_blockui_card', {
overlayColor: 'red',
opacity: 0.1,
state: 'primary' // a bootstrap color
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_card');
}, 2000);
});
$('#kt_blockui_card_custom_spinner').click(function() {
KTApp.block('#kt_blockui_card', {
overlayColor: '#000000',
state: 'warning', // a bootstrap color
size: 'lg' //available custom sizes: sm|lg
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_card');
}, 2000);
});
$('#kt_blockui_card_custom_text_1').click(function() {
KTApp.block('#kt_blockui_card', {
overlayColor: '#000000',
state: 'danger',
message: 'Please wait...'
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_card');
}, 2000);
});
$('#kt_blockui_card_custom_text_2').click(function() {
KTApp.block('#kt_blockui_card', {
overlayColor: '#000000',
state: 'primary',
message: 'Processing...'
});
setTimeout(function() {
KTApp.unblock('#kt_blockui_card');
}, 2000);
});
Click below buttons to block this page.
$('#kt_blockui_page_default').click(function() {
KTApp.blockPage();
setTimeout(function() {
KTApp.unblockPage();
}, 2000);
});
$('#kt_blockui_page_overlay_color').click(function() {
KTApp.blockPage({
overlayColor: 'red',
opacity: 0.1,
state: 'primary' // a bootstrap color
});
setTimeout(function() {
KTApp.unblockPage();
}, 2000);
});
$('#kt_blockui_page_custom_spinner').click(function() {
KTApp.blockPage({
overlayColor: '#000000',
state: 'warning', // a bootstrap color
size: 'lg' //available custom sizes: sm|lg
});
setTimeout(function() {
KTApp.unblockPage();
}, 2000);
});
$('#kt_blockui_page_custom_text_1').click(function() {
KTApp.blockPage({
overlayColor: '#000000',
state: 'danger',
message: 'Please wait...'
});
setTimeout(function() {
KTApp.unblockPage();
}, 2000);
});
$('#kt_blockui_page_custom_text_2').click(function() {
KTApp.blockPage({
overlayColor: '#000000',
state: 'primary',
message: 'Processing...'
});
setTimeout(function() {
KTApp.unblockPage();
}, 2000);
});
Lorem Ipsum is simply dummy text of the printing and industry.
There are many variations of passages of Lorem Ipsum available.
Contrary to popular belief, Lorem Ipsum is not simply random text.
If you are going to use a passage of Lorem Ipsum, you need.
To start a blog, think of a topic about and first brainstorm ways to write details
To start a blog, think of a topic about and first brainstorm ways to write details
To start a blog, think of a topic about and first brainstorm ways to write details
To start a blog, think of a topic about and first brainstorm ways to write details
