Skip to main content
15-Moonstone
April 11, 2019
Solved

3D Image Blink in Experience

  • April 11, 2019
  • 1 reply
  • 1881 views

I created an experience in which I want to show sequence location with Blinking 3D Image (Arrow). 

@-webkit-keyframes blinker {
 from {opacity: 1.0;}
 to {opacity: 0.0;}
}

.blink {
	text-decoration: blink;
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 0.6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-direction: alternate;
}

I used above css on 3D lable but it's not working.

Can someone help me with this or give any better solution. 

Best answer by nqwifly

You can use $interval function as follow:

$scope.blink= function(){
	interval= $interval( function(){
 $scope.app.view.Home.wdg["3DImage-4"]["visible"] = !$scope.app.view.Home.wdg["3DImage-4"]["visible"];
 }, 
 500); // interval duration .5 second
}

 

Consider cancelling the interval whenever you're done with it by:

 	$interval.cancel(interval);

 

Regards,

 

1 reply

nqwifly1-VisitorAnswer
1-Visitor
April 11, 2019

You can use $interval function as follow:

$scope.blink= function(){
	interval= $interval( function(){
 $scope.app.view.Home.wdg["3DImage-4"]["visible"] = !$scope.app.view.Home.wdg["3DImage-4"]["visible"];
 }, 
 500); // interval duration .5 second
}

 

Consider cancelling the interval whenever you're done with it by:

 	$interval.cancel(interval);

 

Regards,