File: style.css

Recommend this page to a friend!
  Classes of John Diaz   jQuery Lazy Load Gallery   style.css   Download  
File: style.css
Role: Auxiliary data
Content type: text/plain
Description: CSS Styles file
Class: jQuery Lazy Load Gallery
Plugin to show gallery of images loaded via AJAX
Author: By
Last change:
Date: 9 years ago
Size: 1,951 bytes
 

Contents

Class file image Download
.glyphicon-refresh-animate { -animation: spin .7s infinite linear; -webkit-animation: spin2 .7s infinite linear; } @-webkit-keyframes spin2 { from { -webkit-transform: rotate(0deg);} to { -webkit-transform: rotate(360deg);} } @keyframes spin { from { transform: scale(1) rotate(0deg);} to { transform: scale(1) rotate(360deg);} } .ajax-gallery-container img { max-width: 100%; cursor: pointer; } .overlay, .ajax-gallery-full-container { background-color: rgba(0,0,0,0.8); color: #FFF; z-index: 10000; } .ajax-gallery-full-container { width: 100%; position: fixed; left: 0; top: 0; height: 100%; text-align: center; } .ajax-gallery-full-container img { opacity: 1; max-width: 90%; max-width: 100%; border: 5px solid #FFF; position: absolute; } .ajax-gallery-thumb { cursor: pointer; padding: 2px; margin: 1px; width: 65px; height: 58px; float: left; display: table-cell; vertical-align: middle; text-align: center; } .ajax-gallery-thumb img { height: 100%; width: 100%; } .ajax-gallery-thumb-container { display: inline-block; overflow: hidden; height: 65px; } .ajax-gallery-thumbs-scroll { padding: 0 15px; overflow: hidden; position: relative; margin-top: 5px; height: 69px; display: block; } .ajax-gallery-thumbs-scroll .move-previous, .ajax-gallery-thumbs-scroll .move-next { position: absolute; top: 30%; width: auto; cursor: pointer; background: #000; color: #FFF; } .ajax-gallery-thumbs-scroll .move-previous { left: 5px; } .ajax-gallery-thumbs-scroll .move-next { right: 5px; } .thumb a .title { color: #FFF; font-size: 14px; font-weight: bold; display: block; background: #000; padding: 3px; text-align: center; }