Hack to make asynchronous JQuery Slider/Motion -> Synchronized.
Scenario : JQuery slider contains 8+ images. 4 images are visible on screen at a time and user can click next and previous links to move slider.
But if user clicks next/previous button multiple times. Slider's UI breaks.
We have to stop user from clicking next/previous second time if slider is moving or in progress.



var isProcessing = 0;
var waitMiliSec = 1100;
var objInterval;
 
function moveToPrevious() {
if (isProcessing == 0) {
setIsProcessing(1, 0);
objInterval = setInterval(function () { setIsProcessing(0, 1) }, waitMiliSec);
//Slider's asynchronyzed slide code
//Any JQuery asynchronyzed code
}
 
 
}
function moveToNext() {
if (isProcessing == 0) {
setIsProcessing(1, 0);
objInterval = setInterval(function () { setIsProcessing(0, 1) }, waitMiliSec);
//Slider's asynchronyzed slide code
//Any JQuery asynchronyzed code
}
}
 
 
function setIsProcessing(processValue, clearInt) {
isProcessing = processValue;
if (clearInt == 1) { clearInterval(objInterval); }
}

Comments

Popular posts from this blog

Dataverse D365 REST Web Api using client secret From Postman or Power Automate desktop (PAD) .

Chrome Extension to auto refresh Power BI report.

How to call SharePoint online rest APIs using postman?