PHP Classes

File: assets/css/jquery.popeye.style.css

Recommend this page to a friend!
  Classes of Michael Beck   XOOPS Publisher Module   assets/css/jquery.popeye.style.css   Download  
File: assets/css/jquery.popeye.style.css
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: XOOPS Publisher Module
Publish static HTML content and article with XOOPS
Author: By
Last change:
Date: 5 years ago
Size: 7,408 bytes
 

Contents

Class file image Download
/* * jquery.popeye.style.css 2.1 * * Example styles for jQuery.popeye * * Copyright (C) 2011 Christoph Schuessler (schreib@herr-schuessler.de) * * This program is free software; you can redistribute it and/or modify * it under the terms of the GNU General Public License as published by * the Free Software Foundation; either version 2 of the License, or * (at your option) any later version. * */ /* fallback styles for image list */ .ppy-imglist { width: 100%; display: block; overflow: hidden; } .ppy-imglist li { padding: 10px; border: 1px solid #f0f0f0; border-radius: 5px; background: #fff; list-style: none; float: left; display: block; margin: 0 10px 10px 0; } .ppy-imglist li a img { display: block; border: 0; } #ppy1 .ppy-extcaption { width: 240px; display: block; } #ppy1 .ppy-imglist li { width: 240px; height: 270px; } #ppy2 .ppy-imglist li, #ppy2 .ppy-imglist li a { width: 160px; height: 160px; overflow: hidden; display: block; } /* popeye example 1 */ #ppy1.ppy-active { width: 262px; float: left; margin: 0 20px 10px 0; } #ppy1 .ppy-outer { padding: 10px; border: 1px solid #e1f1a1; border-radius: 0 10px 10px 10px; background: #eff9c7; } #ppy1 .ppy-stage { width: 240px; height: 173px; border-radius: 0 5px 5px 5px; cursor: pointer; } #ppy1 .ppy-outer:hover, #ppy1.ppy-expanded .ppy-outer { border: 1px solid #d5e68e; -webkit-box-shadow: 0 0 7px #ccc; box-shadow: 0 0 7px #ccc; } #ppy1 .ppy-caption { margin: 5px 0 0 0; padding: 10px; font-size: 0.9em; line-height: 1.3em; color: #809f21; background: #eeffa8; border-radius: 10px; -webkit-box-shadow: 0 0 7px #ccc; box-shadow: 0 0 7px #ccc; visibility: hidden; /* prevent flash of content before popeye loads */ } #ppy1 .ppy-caption a { color: #66bde9; } #ppy1 .ppy-caption a:hover { text-decoration: underline; } #ppy1 .ppy-counter { border-bottom: 1px solid #d5e68e; color: #b8cf5a; padding: 0 0 2px 0; margin: 0 0 5px 0; font-size: 0.9em; } #ppy1 .ppy-stagewrap { background: #0c3b3d; border-radius: 0 5px 5px 5px; } #ppy1 .ppy-loading { background: #0c3b3d url(../images/popeye/loading1.gif) no-repeat center !important; } #ppy1 .ppy-nav { background: #0c3b3d; background: -webkit-gradient(linear, center top, from(#0c3b3d), to(#3a8385)); background: linear-gradient(to center top, #0c3b3d 0%, #3a8385 100%); width: 104px; height: 32px; padding: 5px; position: absolute; top: 0; left: 0; border-radius: 0 0 5px 5px; } #ppy1 .ppy-nav a { display: block; overflow: hidden; text-indent: -900em; height: 22px; float: left; padding: 5px; border-radius: 5px; } #ppy1 .ppy-prev { width: 22px; background: url(../images/popeye/prev3.png) no-repeat center; } #ppy1 .ppy-next { width: 22px; background: url(../images/popeye/next3.png) no-repeat center; } #ppy1 .ppy-switch-enlarge { width: 30px; background: url(../images/popeye/enlarge3.png) no-repeat center; } #ppy1 .ppy-switch-compact { width: 30px; background: url(../images/popeye/compact3.png) no-repeat center; } #ppy1 .ppy-nav a:hover { background-color: #a1c436; cursor: pointer; } /* popeye example 2 */ #ppy2.ppy-active { width: 224px; float: right; margin: 0 0 10px 20px; } #ppy2 .ppy-outer { padding: 0 46px 0 0; } #ppy2 .ppy-stagewrap { padding: 7px; border-radius: 5px 0 5px 5px; background: #c1eaff; } #ppy2 .ppy-stage { width: 160px; height: 160px; border: 2px solid #fff; border-radius: 3px; background-color: #777; cursor: pointer; } #ppy2 .ppy-counter { background: #fff; color: #333; padding: 0 5px; font-size: 0.8em; position: absolute; bottom: 0; right: 0; opacity: 0.7; border-radius: 5px 0 0 0; } #ppy2 .ppy-loading { background: url(../images/popeye/loading2.gif) no-repeat center; } #ppy2 .ppy-nav { border-radius: 0 5px 5px 0; background: #76c6ee; background: -webkit-gradient(linear, left top, right bottom, from(#76c6ee), to(#2d9ed6)); background: linear-gradient(to right bottom, #76c6ee 0%, #2d9ed6 100%); border-left: 1px solid #6ab1d5; width: 45px; position: absolute; top: 4px; right: 0; } #ppy2 .nav-wrap { padding: 5px 0; } #ppy2 .ppy-nav a { display: block; overflow: hidden; text-indent: -900em; height: 22px; padding: 5px; border-radius: 0 5px 5px 0; width: 30px; } #ppy2 .ppy-prev { background: url(../images/popeye/prev3.png) no-repeat center; } #ppy2 .ppy-next { background: url(../images/popeye/next3.png) no-repeat center; } #ppy2 .ppy-switch-enlarge { background: url(../images/popeye/enlarge4.png) no-repeat center; } #ppy2 .ppy-switch-compact { background: url(../images/popeye/compact4.png) no-repeat center; } #ppy2 .ppy-nav a:hover { background-color: #378eba; cursor: pointer; opacity: 0.8; } /* popeye example 3 */ #ppy3.ppy-active { width: 240px; float: left; margin: 0 20px 10px 0; } #ppy3 .ppy-outer { } #ppy3 .ppy-stage { width: 240px; height: 180px; overflow: hidden; cursor: pointer; } #ppy3 .ppy-stagewrap { background: #333; } #ppy3 .ppy-caption { margin: 10px 0 0 0; padding: 0 5px 3px 0; font-size: 0.9em; line-height: 1.3em; color: #666; height: 60px; overflow: auto; border-bottom: 1px solid #ddd; } #ppy3.ppy-expanded .ppy-caption { margin: 0; padding: 10px; color: #fff; border-bottom: 1px solid #333; background: #666; } #ppy3 .ppy-counter { background: #333; color: #fff; padding: 0 5px; font-size: 0.8em; position: absolute; bottom: 0; left: 0; opacity: 0.7; } #ppy3 .ppy-loading { background: #333 url(../images/popeye/loading3.gif) no-repeat center !important; } #ppy3 .ppy-nav { background: #333; background: #333333; background: -webkit-gradient(linear, center top, from(#333333), color-stop(40%, #333333), color-stop(60%, #333333), to(#333333)); background: linear-gradient(to center top, #333333 0%, #333333 40%, #333333 60%, #333333 100%); width: 100%; height: 100%; text-align: center; } #ppy3 .nav-wrap { width: 104px; height: 32px; padding: 30% 0 0 0; margin: 0 auto 0 auto; } #ppy3 .ppy-nav a { display: block; overflow: hidden; text-indent: -900em; height: 22px; float: left; padding: 5px; border-radius: 5px; } #ppy3 .ppy-prev { width: 22px; background: url(../images/popeye/prev3.png) no-repeat center; } #ppy3 .ppy-next { width: 22px; background: url(../images/popeye/next3.png) no-repeat center; } #ppy3 .ppy-switch-enlarge { width: 30px; background: url(../images/popeye/enlarge3.png) no-repeat center; } #ppy3 .ppy-switch-compact { width: 30px; background: url(../images/popeye/compact3.png) no-repeat center; } #ppy3 .ppy-play { width: 22px; background: url(../images/popeye/play3.png) no-repeat center; } #ppy3 .ppy-pause { width: 22px; background: url(../images/popeye/pause3.png) no-repeat center; } #ppy3 .ppy-nav a:hover { background-color: #333; cursor: pointer; }