"1mm3rse02"
Bootstrap 3.3.0 Snippet by okebro

Post to Facebook Tweet this

<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 ----------> <html> <head> <meta charset="utf-8"> <link href='https://fonts.googleapis.com/css?family=Roboto:300,400,700' rel='stylesheet' type='text/css'> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script type="text/javascript" src="http://rumart.weebly.com/files/theme/jquery.immersive-slider.js"></script> <link href="http://rumart.weebly.com/files/theme/immersive-slider.css" rel="stylesheet" type="text/css"> <style> html { height: 100%; } body { background: #f3f3f3; padding: 0; text-align: center; font-family: 'Roboto', sans-serif; position: relative; margin: 0; height: 100%; } .wrapper { height: auto !important; height: 100%; margin: 0 auto; overflow: hidden; } a { text-decoration: none; } hk { width: 100%; float: left; } hk { font-family: 'Roboto', sans-serif; color: #fff; font-weight: 100; margin-top: 0; margin-bottom: 10px; } .main { float: left; width: 100%; margin: 0 auto; background: #161923; } .page_container { max-width: 960px; margin: 50px auto; } .immersive_slider .is-slide .content hk { line-height: 120%; font-weight: 100; color: white; } .immersive_slider .is-slide .content a { color: white; } .immersive_slider .is-slide .content pk { float: left; font-weight: 100; width: 100%; font-size: 90%; margin-top: 5px; } </style> </head> <body> <div class="wrapper"> <div class="main"> <div class="page_container"> <div id="immersive_slider"> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/001.jpg"> <div class="content"> <hk>Dormitory</hk> <pk>Location : Jojoran, Surabaya.</pk> <pk>Completion : On Progress.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/001.jpg" alt="Slider 1"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/002c.jpg"> <div class="content"> <hk>Residential</hk> <pk>Location : Semolowaru, Surabaya.</pk> <pk>Completion : 2014.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/002c.jpg" alt="Slider 2"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/003.jpg"> <div class="content"> <hk>Kampung Kids's Resto</hk> <pk>Location : Batu, Malang.</pk> <pk>Completion : On Progress.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/003.jpg" alt="Slider 3"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/011.jpg"> <div class="content"> <hk>Residential</hk> <pk>Location : Mojokerto.</pk> <pk>Completion : On Progress.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/011.jpg" alt="Slider 4"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/005.jpg"> <div class="content"> <hk>Pantry</hk> <pk>Location : Citraland, Surabaya.</pk> <pk>Completion : 2015.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/005.jpg" alt="Slider 5"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/006.jpg"> <div class="content"> <hk>Living Room</hk> <pk>Location : SDPU, Surabaya.</pk> <pk>Completion : 2015.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/006.jpg" alt="Slider 6"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/007.jpg"> <div class="content"> <hk>Food Corner</hk> <pk>Location : Kapas Krampung, Surabaya.</pk> <pk>Completion : 2014.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/007.jpg" alt="Slider 7"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/008.jpg"> <div class="content"> <hk>Residential</hk> <pk>Location : MERR, Surabaya.</pk> <pk>Completion : 2015.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/008.jpg" alt="Slider 8"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/009.jpg"> <div class="content"> <hk>Pantry</hk> <pk>Location : Citra Garden, Sidoarjo.</pk> <pk>Completion : 2014.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/009.jpg" alt="Slider 9"> </div> </div> <div class="slide" data-blurred="http://rumart.weebly.com/files/theme/010.jpg"> <div class="content"> <hk>Pantry</hk> <pk>Location : Delta Sari, Sidoarjo.</pk> <pk>Completion : 2015.</pk> </div> <div class="image"> <img src="http://rumart.weebly.com/files/theme/010.jpg" alt="Slider 10"> </div> </div> <a href="#" class="is-prev">«</a> <a href="#" class="is-next">»</a> </div> </div> </div> <script type="text/javascript"> $(document).ready( function() { $("#immersive_slider").immersive_slider({ container: ".main" }); }); </script> </div> </body> </html>

Related: See More

Vue Material Kit

Questions / Comments: