How to create Sliding Buttons and there sequences

Hello manojpandey

for sliding panels I am using a CSS:

.panel-hide {
 position: fixed;
 right: -300px;
 top: 0;
 width: 300px;
 height: 100vh
}

.panel-show {
 position: fixed;
 right: 0;
 top: 0;
 width: 300px;
 height: 100vh
}

Then it is up to you how you assign these styles via JS. You can for example call a function under  Play button (or in "Play Started" event under model) which will check step number for displaying/changing a specific widgets - for example simple way via switch:

$scope.setStepWdgs = function() {
 var step = $scope.view.wdg['model-1']['currentStep'];
 switch(step) {
 case 4:
 // Display panel on start of step #4:
 $scope.view.wdg['panel-1']['class'] = "panel-show";
 break;
 case 5:
 // Hide panel on start of step #5:
 $scope.view.wdg['panel-1']['class'] = "panel-hide";
 break;
 default:
 /*some code for common steps*/
 }
}

Tomas

PS: This code is only example I didn't try it 😅