JSFiddle - React, Tailwind, and code Playground

by rangga maulana

HTML

<!-- fadeIn, fadeOut dan fadeTo -->
<button class="hilang">Hilang!</button>
<button class="muncul">Muncul!</button>
<button class="fd-to">FadeTo 0.5</button>
<button class="fd-to1">Reset</button>
<div id="target"><a href="http://trik-rangga.blogspot.com" target="_blank">Trik Rangga</a></div>

CSS

body {padding:30px;}

#target {
  background:rgb(37, 42, 61);
  margin-bottom:15px;
  height:200px;
  padding:5px;
  color:#fff;
}

JavaScript

$('.hilang').click(function() {
    $('#target').fadeOut('normal');
});

$('.muncul').click(function() {
    $('#target').fadeIn('normal');
});

$('.fd-to').click(function() {
    $('#target').fadeTo('fast', 0.5);
});

$('.fd-to1').click(function() {
    $('#target').fadeTo(1000, 1);
});