Commit c2de8842 by Palti Sinaga

test

parent a097139b
public/img/gallery-1.jpg

37.7 KB | W: | H:

public/img/gallery-1.jpg

169 KB | W: | H:

public/img/gallery-1.jpg
public/img/gallery-1.jpg
public/img/gallery-1.jpg
public/img/gallery-1.jpg
  • 2-up
  • Swipe
  • Onion skin
......@@ -10,7 +10,7 @@
<div class="login-box" style="box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 20px 0px, rgba(0, 0, 0, 0.239216) 0px 5px 5px 0px; background-color: rgba(255, 255, 255, 0); ">
<!-- <div class="login-logo">
<a href="{{ url('/home') }}"><b>SIBH</b></a>
</div><!-- /.login-logo -->
</div><!-- /.login-logo -->
@if (count($errors) > 0)
<div class="alert alert-danger">
......@@ -26,7 +26,7 @@
<div class="login-box-body" >
<!-- <p class="login-box-msg"> {{ trans('adminlte_lang::message.siginsession') }} </p> -->
<div class="login-logo">
<a href="{{ url('/home') }}"><b>SIBH</b></a>
<a href="{{ url('/home') }}"><b>BOOKING BULBUL HOMESTAY</b></a>
</div><!-- /.login-logo -->
<form action="{{ url('/login') }}" method="post">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
......
......@@ -136,7 +136,15 @@
@foreach($dataKamar as $dk)
<div class="col-md-3 col-sm-3 details-grid agileits w3layouts details-grid-1">
<div id="gambar">
<img src="/img/{{$dk->gambar}}" alt="Agileits W3layouts" data-toggle="modal" data-target="#myModal" style="cursor: pointer;">
<a class="example-image-link agileits w3layouts" href="/img/{{$dk->gambar}}" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/{{$dk->gambar}}" alt="Agileits W3layouts" id="data">
<figcaption></figcaption>
</figure>
</div>
</a>
<!-- <img src="" alt="Agileits W3layouts" data-toggle="modal" data-target="#myModal" style="cursor: pointer;"> -->
</div>
<div class="clearfix"></div>
</div>
......
......@@ -6,117 +6,150 @@
<img src="/img/danautoba.jpg" alt="Agileits W3layouts" style="max-height:500px; width:">
<h1 class="wow agileits w3layouts fadeInDown">Gallery Wisata Lumban Bulbul
</h1>
</h1>
</div>
<!-- //Banner -->
<div class="details agileits w3layouts" style="padding:10px; " >
<div class="container" style="margin-top:10px; background-color:white; width:950px; margin-left:auto; margin-right:auto; margin-top:20px; padding-top: 30px;padding-bottom:10px; box-shadow:2px 2px 5px 0px #bfbebe">
<div class="portfolio agileits w3layouts">
<div class="ga-top agileits w3layouts">
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
</div>
<div class="portfolio agileits w3layouts">
<div class="ga-top agileits w3layouts">
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/gallery-1.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/gallery-1.jpg" alt="Agileits W3layouts" id="data">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-4 agileits w3layouts portfolio-top">
<div class="portfolio-item agileits w3layouts wow zoomIn">
<a class="example-image-link agileits w3layouts" href="/img/danautoba.jpg" data-lightbox="example-set" data-title="">
<div class="grid agileits w3layouts">
<figure class="effect-apollo agileits w3layouts">
<img src="/img/danautoba.jpg" alt="Agileits W3layouts">
<figcaption></figcaption>
</figure>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<h1>Bootstrap 3 Lightbox image gallery using Modal</h1>
<div class="col-lg-3 col-sm-4 col-xs-6"><a title="Image 1" href="#"><img class="thumbnail img-responsive" src="/img/gallery-1.jpg"></a></div>
<div class="col-lg-3 col-sm-4 col-xs-6"><a title="Image 2" href="#"><img class="thumbnail img-responsive" src="/img/danautoba.jpg"></a></div>
<hr>
<hr>
</div>
</div>
<div tabindex="-1" class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal">×</button>
<h3 class="modal-title">Heading</h3>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- //Tooltip-Content -->
<!-- Date-Picker-JavaScript -->
<script src="{{asset('js/jquery-ui.js')}}"></script>
<script>
document.getElementById('book').onclick = function(){
swal("Good job!", "You clicked the button!", "success");};
document.getElementById('book').onclick = function(){
swal("Good job!", "You clicked the button!", "success");};
</script>
<script>
document.querySelector(' ').onclick = function(){
swal("Good job!", "You clicked the button!", "success");};
document.querySelector(' ').onclick = function(){
swal("Good job!", "You clicked the button!", "success");};
</script>
<script>
document.querySelector('').onclick = function(){
swal({
title:"Are you sure?",
text: "You will not be able to recover this imaginary file!",
type: "warning",
showCancelButton: true,
confirmButtonColor: '#DD6B55',
confirmButtonText: 'Yes, delete it!',
cancelButtonText: "No, cancel plx!",
closeOnConfirm: false,
closeOnCancel: false
},
function(isConfirm){
if (isConfirm){
swal("Deleted!", "Your imaginary file has been deleted!", "success");
} else {
swal("Cancelled", "Your imaginary file is safe :)", "error");
}
});
};
document.querySelector('').onclick = function(){
swal({
title:"Are you sure?",
text: "You will not be able to recover this imaginary file!",
type: "warning",
showCancelButton: true,
confirmButtonColor: '#DD6B55',
confirmButtonText: 'Yes, delete it!',
cancelButtonText: "No, cancel plx!",
closeOnConfirm: false,
closeOnCancel: false
},
function(isConfirm){
if (isConfirm){
swal("Deleted!", "Your imaginary file has been deleted!", "success");
} else {
swal("Cancelled", "Your imaginary file is safe :)", "error");
}
});
};
</script>
......
......@@ -12,6 +12,7 @@
<!-- Custom-Stylesheet-Links -->
<!-- Bootstrap-CSS -->
<link rel="stylesheet" href="{{asset('css/bootstrap.min.css')}}" type="text/css" media="all">
<link rel="stylesheet" href="{{asset('css/lightbox.css')}}" type="text/css" media="all">
<link rel="stylesheet" href="{{asset('css/bootstrap.min.css')}}" type="text/css" media="all">
<!-- Index-Page-CSS -->
......
......@@ -18,6 +18,18 @@ new WOW().init();
</script>
<!-- //Animate.CSS-JavaScript -->
<script type="text/javascript">
$(document).ready(function() {
$('.thumbnail').click(function(){
$('.modal-body').empty();
var title = $(this).parent('a').attr("title");
$('.modal-title').html(title);
$($(this).parents('div').html()).appendTo('.modal-body');
$('#myModal').modal({show:true});
});
});
</script>
<!-- Slider-JavaScript -->
<script src="{{asset('js/responsiveslides.min.js')}}"></script>
<script>
......
......@@ -119,6 +119,10 @@ Route::get('gallery', function(){
return view('gallery');
});
Route::get('gallerrry', function(){
return view('media_gallery');
});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment