Bootstrap Snippet jQuery Slider Ref: "Gallery with slider" by Harut using HTML CSS jQuery

1
2
3
4
5
6
7
8
9
<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 ---------->
<body>
<div class="container">
</div>
</body>
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
.hide-bullets {
    list-style:none;
    margin-left: -40px;
    margin-top:20px;
}
.thumbnail {
    padding: 0;
}
.carousel-inner>.item>img, .carousel-inner>.item>a>img {
    width: 100%;
}
.col-sm-3 a {
    border: 1px solid transparent;
    border-radius: 0;
    transition: all 3s ease;
}
.col-sm-3 a:hover {
    border: 1px solid #ff4647;
    border-radius: 100% 60% / 30% 10%;
    background: linear-gradient(rgba(56,123,131,0.7),rgba(56,123,131,0.7));
}
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
$(document).ready(function(){
   
             var data = [];
     
     /*
      *getData method fetches data from mongo db and renders into gallery.hbs view
      * 
      */
                        var getData = function(){
                            
                                 var obj = new Object(
                                 {
                                       'id':'2',
                                       'path': 'https://s3-eu-west-1.amazonaws.com/imagestramorestainedglass/dragonflies(150x150).png',
                                       'title': 'Dragon Flies',
                                       'description': 'Dragon Flies',
                                       'category': '',
                                       'date': 'Tue Dec 06 2016 11:20:18 GMT+0000 (GMT)'
                                 });
                                    data.push(obj);
                                 var obj = new Object(
                                 {
                                       'id':'3',
                                       'path': 'https://s3-eu-west-1.amazonaws.com/imagestramorestainedglass/redsnowman(150x150).png',
                                       'title': 'Christmas Decoration Snow Man',
                                       'description': 'Very beutufull christmas decoration for your christmas tree, Red Snow Man',
                                       'category': '',
                                       'date': 'Tue Dec 06 2016 09:19:14 GMT+0000 (GMT)'
                                 });
                                    data.push(obj);
                                 var obj = new Object(
                                 {
                                       'id':'4',
                                       'path': 'https://s3-eu-west-1.amazonaws.com/imagestramorestainedglass/xdecoration(150x150).png',
                                       'title': 'Christmas Decoration House',
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"jQuery Slider Ref: "Gallery with slider" by Harut"
Bootstrap 3.3.0 Snippet by deividas777

Related: See More

Questions / Comments:

"jQuery Slider Ref: "Gallery with slider" by Harut" Bootstrap 3.3.0 Snippet by deividas777

Related: See More

Questions / Comments:

"jQuery Slider Ref: "Gallery with slider" by Harut"
Bootstrap 3.3.0 Snippet by deividas777