Sound waves

Developer
Maharajan
Size
1,738 Kb
Views
6,072
  1. Sound waves Previews
  2. Sound waves HTML Codes
  3. Sound waves CSS Codes

How do I make an sound waves?

What is a sound waves? How do you make a sound waves? This script and codes were developed by Maharajan on 26 January 2023, Thursday.

Sound waves Previews
IQ Test

Sound waves - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>sound waves</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="echo"> <span></span> <span></span> <span></span>
</div>
</body>
</html>

Sound waves - Script Codes CSS Codes

* { margin:0; padding:0; outline:none; list-style:none; text-decoration:none; box-sizing:border-box; color:#000; background: transparent; border:none;
}
html, body { height: 100%; width: 100%; overflow:hidden;
}
body
{ background:skyblue; width:100%; height:100%;
}
.echo
{ width:100%; height:100%; position:relative;
left:0px; top:0px;
}
.echo > span
{ position: absolute; top:100px;bottom:0px;left: -200px;right:0px; margin: auto; width: 400; height: 400; opacity: 1; border-radius:50%; border: 2px #fff solid; -webkit-transition:all 2s ease; -webkit-animation:echo 3s ease .5s infinite;
}
.echo > span:nth-of-type(2)
{ -webkit-animation:echo 3s ease .7s infinite;
}
.echo > span:nth-of-type(3)
{ -webkit-animation:echo 3s ease .9s infinite;
}
@-webkit-keyframes echo
{ 0%{ width:0px; height:0px; opacity:1; } 100% { width:400px; height:400px; opacity:0;
}
}
Sound waves - Script Codes
Sound waves - Script Codes
Home Page Home
Developer Maharajan
Username mhrjnsa1
Uploaded January 26, 2023
Rating 3
Size 1,738 Kb
Views 6,072
Do you need developer help for Sound waves?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Maharajan (mhrjnsa1) Script Codes
Name
Text appearance
Change background while click and hover
Drop down options disable
Notification
A Pen by maharajan
Parallax scrolling
Pure css loader
Locator
Circle loader
Hover input
Create amazing web content with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!