onclick button change playing status, replace main block
This commit is contained in:
		@@ -6,11 +6,22 @@ body {
 | 
			
		||||
  background-size: cover;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.parent {
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    height: 100%;
 | 
			
		||||
    position: fixed;
 | 
			
		||||
    top: 0;
 | 
			
		||||
    left: 0;
 | 
			
		||||
    display: flex;
 | 
			
		||||
    align-items: center;
 | 
			
		||||
    align-content: center; 
 | 
			
		||||
    justify-content: center; 
 | 
			
		||||
    overflow: auto;   
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#song{
 | 
			
		||||
  width: 400px;
 | 
			
		||||
  height: 300px;
 | 
			
		||||
  margin: auto;
 | 
			
		||||
  justify-content : center;
 | 
			
		||||
  height: 340px;
 | 
			
		||||
  background-color: rgba(0, 0, 0, 0.7);
 | 
			
		||||
  border-radius: 10px;
 | 
			
		||||
  color: #fff;
 | 
			
		||||
 
 | 
			
		||||
@@ -16,13 +16,12 @@
 | 
			
		||||
 | 
			
		||||
<body>
 | 
			
		||||
 | 
			
		||||
<div class="parent">
 | 
			
		||||
	<div id="song">
 | 
			
		||||
 | 
			
		||||
		<h1>Just Radio</h1>
 | 
			
		||||
 | 
			
		||||
		now playing:
 | 
			
		||||
 | 
			
		||||
		<br>
 | 
			
		||||
		<div id="myPlay">-</div>
 | 
			
		||||
 | 
			
		||||
		<div id="title">title</div>
 | 
			
		||||
 | 
			
		||||
@@ -53,15 +52,19 @@
 | 
			
		||||
		<div id="listeners">title</div>
 | 
			
		||||
 | 
			
		||||
	</div>
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
<script language="JavaScript">
 | 
			
		||||
	var audio = new Audio('http://stream.santic-zombie.ru');
 | 
			
		||||
	var play = document.getElementById('play');
 | 
			
		||||
	play.addEventListener('click', function() {
 | 
			
		||||
		$("#myPlay").text("Now playing:");
 | 
			
		||||
		audio.play();
 | 
			
		||||
	}, false);
 | 
			
		||||
	var pause = document.getElementById('pause');
 | 
			
		||||
	pause.addEventListener('click', function() {
 | 
			
		||||
		 $("#myPlay").text("Paused");
 | 
			
		||||
	     audio.pause();
 | 
			
		||||
	}, false);
 | 
			
		||||
	var volume = document.getElementById('volume');
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user