Best Button Animation ever. Gooey
A Pen by Unleashed Design on CodePen.
<!-- オーバーレイ / Overlay --> | |
<div id="overlay"> | |
<p><span class="far"></span>now loading...</p> | |
</div> | |
<!-- ヘッダ / Header --> | |
<div id="header"> | |
<!-- 再生コントロール / Playback control --> | |
<div id="control" class="far"> | |
<a href="#" id="play" class="disabled"></a> |
<!-- オーバーレイ / Overlay --> | |
<div id="overlay"> | |
<p><span class="far"></span>now loading...</p> | |
</div> | |
<!-- ヘッダ / Header --> | |
<div id="header"> | |
<!-- 再生コントロール / Playback control --> | |
<div id="control" class="far"> | |
<a href="#" id="play" class="disabled"></a> |
<div class="help"></div> | |
<div class="blobs"> | |
<div class="blob"></div> | |
<div class="blob"></div> | |
</div> |
A Pen by Emre Süslü on CodePen.
A Pen by M Fathurrohman Mauludin on CodePen.
<html> | |
<head> | |
<title>Speech to text Converter</title> | |
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> | |
</head> | |
<body> | |
<h3 align="center">Speech to text converter JavaScript</h3> | |
<div id="result"></div> | |
<button onclick="startConverting();"><i class="fa fa-microphone btn btn-danger" aria-hidden="true"></i></button> | |
</body> |
<div id="wrapper"></div> |
<ul class="m-d expand-list"> | |
<li data-md-content="200"> | |
<label name="tab" for="tab1" tabindex="-1" class="tab_lab" role="tab">Product Description</label> | |
<input type="checkbox" checked class="tab" id="tab1" tabindex="0" /> | |
<span class="open-close-icon"> | |
<i class="fas fa-plus"></i> | |
<i class="fas fa-minus"></i> | |
</span> | |
<div class="content"> |