Slideshow css transition on title and description

diff --git a/js/custom/pageSetup.js b/js/custom/pageSetup.js
index 1468e03..18081d0 100644 (file)
--- a/js/custom/pageSetup.js
+++ b/js/custom/pageSetup.js
@@ -22,18 +22,22 @@ $(document).ready(function () {
         //console.log('menu-id = ' + menuNum);
     });
     
-    $(".slideshow_slide_slideshow_slide_image").each( function () {
+//    $(".slideshow_slide_slideshow_slide_image").each( function () {
 //       console.debug($(this).children('img').attr('src'));
-    });
+//    });
     
     // this are the functions for the animations, removing the class seems to remove it at the wrong time
-    $(".slideshow_container").on("slideshowAnimationStart", function () {
-//       $(this).find(".slideshow_currentView").find(".slideshow_description").addClass('open');
-    });
+
+//    $(".slideshow_container").on("slideshowAnimationStart", function () {
+//        $(".slideshow_currentView").removeClass('slideshow_open');
+//        $(".slideshow_nextView").addClass('slideshow_open');
+//       
+//    });
     
-    $(".slideshow_container").on("slideshowAnimationEnd", function () {
+//    $(".slideshow_container").on("slideshowAnimationEnd", function () {
+        
 //       $(this).find(".slideshow_currentView").find(".slideshow_description").removeClass('open');
-    });
+//    });
 });
 
 

diff --git a/scss/_slideshow.scss b/scss/_slideshow.scss
index fa734f2..af51bb2 100644 (file)
--- a/scss/_slideshow.scss
+++ b/scss/_slideshow.scss
@@ -23,11 +23,45 @@
         list-style: none;
     }
 }
-.slideshow_container_style-light .slideshow_description_box div.slideshow_title{
-    float: right;
-    padding-right: 100px;
+#slideshow .slideshow_description_box div.slideshow_title{
+    position: absolute;
+    right: 100px;
+    bottom: 0;
+    
+    padding: 10px 20px;
+    background-color: rgba(0,0,0,0.8);
 }
-.slideshow_container_style-light .slideshow_description_box div.slideshow_description{
-   display: none;
+#slideshow .slideshow_description_box div.slideshow_description {
+    background-color: rgba(48,47,107,0.8);
+    padding: 15px 40px;
+    position: absolute;
+    left: -50%;   
+    top: 50%;
 }
 
+#slideshow .slideshow_description_box {
+    top: 0;
+    bottom: 0;
+}
+#slideshow .slideshow_slide {
+    position: relative;
+}
+#slideshow .slideshow_view.slideshow_currentView .slideshow_description_box div.slideshow_description {
+    left: 200px;
+    transition: 0.8s all ease-in-out;
+    border-radius: 24px;
+}
+#slideshow .slideshow_container_style-light .slideshow_description_box {
+    background: none;
+}
+#slideshow .slideshow_container_style-light .slideshow_transparent:hover,
+#slideshow .slideshow_container_style-light .slideshow_transparent {
+    opacity: 1;
+}
+#slideshow .slideshow_container_style-light .slideshow_description_box div.slideshow_title {
+    font-size: 14px;   
+    border-top-left-radius: 4px;
+    border-top-right-radius: 4px;
+    
+}    
+    
\ No newline at end of file