Animasi flashing data dan scroll dengan CSS

Bismillaahirrohmaanirrohiim…

Untuk menampilkan animasi flashing atau blink blink, baik itu pada div atau baris pada tabel bisa menggunakan kode CSS berikut:

@-webkit-keyframes invalid {
  from { background-color: #f39c1285; }
  to { background-color: inherit; }
}
@-moz-keyframes invalid {
  from { background-color: #f39c1285; }
  to { background-color: inherit; }
}
@-o-keyframes invalid {
  from { background-color: #f39c1285; }
  to { background-color: inherit; }
}
@keyframes invalid {
  from { background-color: #f39c1285; }
  to { background-color: inherit; }
}
.flashing, .flashingalt {
     font-weight: bold;
  -webkit-animation: invalid 2s linear infinite; /* Safari 4+ */
  -moz-animation:    invalid 2s linear infinite; /* Fx 5+ */
  -o-animation:      invalid 2s linear infinite; /* Opera 12+ */
  animation:         invalid 2s linear infinite; /* IE 10+ */
}

Sedangkan untuk membuat style pada scroll, baik itu div atau scroll halaman utama, gunakan kode berikut:

.areakelas::-webkit-scrollbar {
  width: 5px;
}
/* Track */
.areakelas::-webkit-scrollbar-track {
    box-shadow: inset 0 0 10px #dd4b39;
  border-radius: 5px;
}

/* Handle */
.areakelas::-webkit-scrollbar-thumb {
    background: #c23321;
    border-radius: 5px;
}

Nah, begitu semoga bermanfaat…