From c2637fc346e3363375f8eb9cf92b3c83d3bb80db Mon Sep 17 00:00:00 2001 From: jason Date: Thu, 17 Jan 2019 09:52:34 +0800 Subject: [PATCH] add button for theater RWD --- app/assets/javascripts/theater.js | 21 ++++++++++++++++++ app/assets/stylesheets/theater.css | 34 ++++++++++++++++++++++++++++++ 2 files changed, 55 insertions(+) diff --git a/app/assets/javascripts/theater.js b/app/assets/javascripts/theater.js index 170a847..cf8f3a9 100644 --- a/app/assets/javascripts/theater.js +++ b/app/assets/javascripts/theater.js @@ -47,6 +47,27 @@ var GalleryTheater = function(){ var id = window.location.hash.split("#")[1]; gt.createTheater("/xhr/galleries/theater/" + id); } + var addButton = function () { + $('.theaterButton').remove(); + $(' ').insertAfter($('img.gal-active')); + if (!$(".gal-prev").length) { $('#theaterPreviousButton').remove(); } + if (!$(".gal-next").length) { $('#theaterNextButton').remove(); } + + $('#theaterPreviousButton').click(function () { + gt.previousPic(); + }); + $('#theaterNextButton').click(function () { + gt.nextPic(); + }); + } + + addButton(); + function locationHashChanged() { + addButton(); + } + + window.onhashchange = locationHashChanged; + } var bindHandler = function(){ diff --git a/app/assets/stylesheets/theater.css b/app/assets/stylesheets/theater.css index 230a204..ca912d0 100644 --- a/app/assets/stylesheets/theater.css +++ b/app/assets/stylesheets/theater.css @@ -455,3 +455,37 @@ body { bottom: 0; } } + +/* CSS for button */ + +@media(max-width: 769px){ + .gallery .gallery-thumb-toggle{ + display: none; + } + } + +/* 相本裡的左右控制鍵 */ +.theaterButton{ +position: absolute; +text-align: center; +width: 45%; +bottom: 50px; +background-color: transparent; +border: none; +color: white; +padding: 15px 32px; +text-align: center; +text-decoration: none; +display: inline-block; +font-size: 2.2rem; +margin: 4px 2px; +cursor: pointer; +border-radius: 5px; +} + +#theaterNextButton{ +right:0; +} +#theaterPreviousButton{ +left:0; +} \ No newline at end of file