ProgressBar/Infinite-loading.html at master · imtypist/ProgressBar · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
<html>
<head>
	<title>infinite loading</title>
	<link rel="stylesheet" type="text/css" href="css/infinite-loading.css">
</head>
<body>
	<div class="small-cube">
        <div class="poster" style="transform:rotateX(0deg) translateZ(50px);background-color: rgba(10, 9, 9, 0.21)"></div>
        <div class="poster" style="transform:rotateX(90deg) translateZ(50px) ;background-color:rgba(247, 0, 0, 0.41)"></div>
        <div class="poster" style="transform:rotateX(180deg) translateZ(50px); background-color: rgba(222, 0, 247, 0.38)"></div>
        <div class="poster" style="transform:rotateX(270deg) translateZ(50px); background-color: rgba(0, 144, 247, 0.38)"></div>
        <div class="poster" style="transform:rotateY(90deg) translateZ(50px) ;background-color: rgba(0, 247, 125, 0.38)"></div>
        <div class="poster" style="transform:rotateY(270deg) translateZ(50px) ;background-color: rgba(247, 244, 0, 0.42)"></div>
    </div>
    <div class="big-cube">
        <div class="poster1" style="transform:rotateX(0deg) translateZ(100px) ;background-color: rgba(10, 9, 9, 0.21)"></div>
        <div class="poster1" style="transform:rotateX(90deg) translateZ(100px) ;background-color:rgba(247, 0, 0, 0.41)"></div>
        <div class="poster1" style="transform:rotateX(180deg) translateZ(100px); background-color: rgba(222, 0, 247, 0.38)"></div>
        <div class="poster1" style="transform:rotateX(270deg) translateZ(100px); background-color: rgba(0, 144, 247, 0.38)"></div>
        <div class="poster1" style="transform:rotateY(90deg) translateZ(100px) ;background-color: rgba(0, 247, 125, 0.38)"></div>
        <div class="poster1" style="transform:rotateY(270deg) translateZ(100px) ;background-color: rgba(247, 244, 0, 0.42)"></div>
    </div>
</body>
</html>