< Back to Examples

Play/Pause

Open Scene in the Editor

The scene starts playing automatically when your scene is displayed. You can however easily pause with embed.scene().pause() and play again with embed.scene().play()

HTML + Javascript

<!DOCTYPE html>
<html>
<head>
<script src="https://unpkg.com/polygonjs-embed@1.0.7/dist/polygonjs-embed.min.js"></script>
<style>
	html, body {height:100%;margin:0px} iframe {display:block;}
	.controls-container {position:absolute;text-align:center;margin:auto;display:block;width:100%}
</style>
</head>

<body>

	<div class='controls-container'>
		<input onclick='pause()' type='button' value='Pause'>
		<input onclick='play()' type='button' value='Play'>
	</div>

	<!-- load your scene iframe (from the editor, go to File->Embed, and toggle on 'Embed Active' to see your iframe html) -->
	<iframe frameborder='0' height='100%' width='100%' src='https://embed.polygonjs.com/scenes/5663bd4e-5ead-439b-bdb7-f7b2ed882710?timestamp=1563316376' id='polygonjs-embed-iframe'></iframe>

	<script>
		// create the embed, with the id of the iframe
		var embed = new POLY.Embed('polygonjs-embed-iframe')
		// call pause and play methods on the embed scene object when the buttons are clicked
		function pause(){ embed.scene().pause() }
		function play(){ embed.scene().play() }
	</script>

</body>

</html>

< Back to Examples