"Flowers Falling Animatin with Intro page"
Bootstrap 3.3.0 Snippet by naimansari

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
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div id="myModal" class="modal bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
<div class="modal-dialog modal-lg" role="document">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true"><img src="http://www.jnvs.in/images/rope.png" alt="rope"></span></button>
<div class="modal-content">
<div class="hotAirBalloonMovement">
<div class="animatedBalloon">
<img alt="" class="horizontalMove" src="http://www.jnvs.in/images/meri-gold.png">
</div>
<div class="animatedBalloon meri2">
<img alt="" class="horizontalMove" src="http://www.jnvs.in/images/meri-gold.png">
</div>
<div class="animatedBalloon meri3">
<img alt="" class="horizontalMove" src="http://www.jnvs.in/images/meri-gold.png">
</div>
<div class="animatedBalloon meri3">
<img alt="" class="horizontalMove" src="http://www.jnvs.in/images/meri-gold.png">
</div>
<div class="animatedBalloon meri4">
<img alt="" class="horizontalMove" src="http://www.jnvs.in/images/meri-gold.png">
</div>
<div class="animatedBalloon meri5">
<img alt="" class="horizontalMove" src="http://www.jnvs.in/images/meri-gold.png">
</div>
<div class="animatedBalloon meri6">
<img alt="" class="horizontalMove" src="http://www.jnvs.in/images/meri-gold.png">
</div>
<div class="animatedBalloon meri7">
<img alt="" class="horizontalMove" src="http://www.jnvs.in/images/meri-gold.png">
</div>
<div class="animatedBalloon meri8">
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
26
27
28
29
30
31
32
33
34
35
36
37
.modal {
display:block;}
.modal-lg button.close {
z-index: 999;
background: transparent;
position:absolute;
top: 0px;
right: 30px;
opacity:0.8;
}
.modal-lg {
position:relative;
width:100%;
height:100%;
margin:0 !important;
}
.modal-open .modal {
background:#fff;
}
.modal-content {
width:100%;
height:100%;
box-shadow:none;
border:none;
text-align:center;
}
.welcome {
color:#073881;
text-align:center;
font-size:20px;
padding-top:15%;
}
.left-animation,
.right-animation {
position:absolute;
top:0;
left:0;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: