wipe #2298 @4

diff --git a/js/libs/fluidbook/fluidbook.links.js b/js/libs/fluidbook/fluidbook.links.js
index 8856a629946431fac9b6249bd9db2109dbd46c70..928034861602dffd04ab8b2e24c7dc20f341e06a 100644 (file)
--- a/js/libs/fluidbook/fluidbook.links.js
+++ b/js/libs/fluidbook/fluidbook.links.js
@@ -35,6 +35,20 @@ FluidbookLinks.prototype = {
             return false;
         });
 
+        $(document).on('mouseenter', '#links a.image_rollover', function () {
+            console.log(this);
+            var id = $(this).closest('[data-id]').data('id');
+            console.log(id);
+            var iid = 'i_' + id;
+            $this.rolloverEnter(iid);
+        });
+
+        $(document).on('mouseleave', '#links a.image_rollover', function () {
+            var id = $(this).closest('[data-id]').data('id');
+            var iid = 'i_' + id;
+            $this.rolloverLeave(iid);
+        });
+
         $(this.fluidbook).on('fluidbook.zoom.in.end', function () {
             $this.zoomLinkReset(true);
             return true;
@@ -591,4 +605,16 @@ FluidbookLinks.prototype = {
                 .css({width: iw, height: ih, transform: 'scale(' + (1 / $this.fluidbook.resize.bookScale) + ')'});
         });
     },
+
+    rolloverEnter: function (iid) {
+        console.log('enter',iid);
+        var e = $('[data-id="' + iid + '"]');
+        e.addClass('animaterollover');
+    },
+
+    rolloverLeave: function (iid) {
+        console.log('leave',iid);
+        var e = $('[data-id="' + iid + '"]');
+        e.removeClass('animaterollover');
+    }
 }

diff --git a/style/fluidbook.less b/style/fluidbook.less
index db9f938f323b5eb14cf029b24e95d45e6759e789..4fea84ed8515ddb1d35a1b381c6d96036a891573 100644 (file)
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -2839,4 +2839,26 @@ body > input {
        font-style: normal;
 }
 
+/* Links anims rollovers */
+@keyframes enterupanddown {
+       0% {
+               margin-top: 0px;
+       }
+       50% {
+               margin-top: -40px;
+       }
+       100% {
+               margin-top: 0px;
+       }
+
+}
+
+[data-rollover="upanddown"] {
+       &.animaterollover {
+               animation-duration: 800ms;
+               animation-name: enterupanddown;
+               animation-timing-function: ease-out;
+       }
+}
+
 @import "additional.less";

diff --git a/style/rollover.less b/style/rollover.less
new file mode 100644 (file)
index 0000000..e69de29