jan
/
sjqg
Archived
1
0
Fork 0

jQuery lightbox Plugin auf AGPL-Version gewechselt (fixes #12)

This commit is contained in:
Jan Dittberner 2008-08-27 23:25:08 +00:00
parent ab502ffa89
commit e06f95874b
15 changed files with 244 additions and 126 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 700 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 812 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 832 B

View File

@ -1,101 +0,0 @@
/**
* jQuery lightBox plugin
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
* and adapted to me for use like a plugin from jQuery.
* @name jquery-lightbox-0.4.css
* @author Leandro Vieira Pinho - http://leandrovieira.com
* @version 0.4
* @date November 17, 2007
* @category jQuery plugin
* @copyright (c) 2007 Leandro Vieira Pinho (leandrovieira.com)
* @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
*/
#jquery-overlay {
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
}
#jquery-lightbox {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#lightbox-nav {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
width: 49%;
height: 100%;
zoom: 1;
display: block;
}
#lightbox-nav-btnPrev {
left: 0;
float: left;
}
#lightbox-nav-btnNext {
right: 0;
float: right;
}
#lightbox-container-image-data-box {
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%;
padding: 0 10px 0;
}
#lightbox-container-image-data {
padding: 0 10px;
color: #666;
}
#lightbox-container-image-data #lightbox-image-details {
width: 70%;
float: left;
text-align: left;
}
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
display: block;
clear: left;
padding-bottom: 1.0em;
}
#lightbox-secNav-btnClose {
width: 66px;
float: right;
padding-bottom: 0.7em;
}

220
css/jquery.lightbox.css Normal file
View File

@ -0,0 +1,220 @@
/*
* jQuery Lightbox Plugin (balupton edition) - Lightboxes for jQuery
* Copyright (C) 2008 Benjamin Arthur Lupton
* http://jquery.com/plugins/project/jquerylightbox_bal
*
* This file is part of jQuery Lightbox (balupton edition).
*
* jQuery Lightbox (balupton edition) is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* jQuery Lightbox (balupton edition) is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with jQuery Lightbox (balupton edition). If not, see <http://www.gnu.org/licenses/>.
*
* @name jquery_lightbox: jquery.lightbox.css
* @package jQuery Lightbox Plugin (balupton edition)
* @version 1.3.0-rc1
* @date August 24, 2008
* @category jQuery plugin
* @author Benjamin "balupton" Lupton {@link http://www.balupton.com}
* @copyright (c) 2008 Benjamin Arthur Lupton {@link http://www.balupton.com}
* @license GNU Affero General Public License - {@link http://www.gnu.org/licenses/agpl.html}
* @example Visit {@link http://jquery.com/plugins/project/jquerylightbox_bal} for more information.
*/
html, body { margin: 0; padding: 0; height: 100%;}
#lightbox, #lightbox-overlay {
position: absolute;
top: 0px;
left: 0px;
bottom:auto;
right:auto;
z-index:100;
width:100%;
height:auto;
text-align:center;
color:#333333;
/* stop stupid conflicts */
margin:0px;
padding:0px;
border:none;
outline:none;
line-height:0;
/* general conflict stopper */
text-decoration:none;
background:none;
word-spacing:normal;
letter-spacing:normal;
float:none;
clear:none;
display:block;
}
#lightbox a, #lightbox a:link, #lightbox a:visited, #lightbox a:hover {
text-decoration:underline;
color:#999999;
}
#lightbox-overlay {
z-index: 90;
background-color:#000000;
height: 100%;
position:fixed;
}
#lightbox-overlay-text {
text-align: right;
margin-right: 20px;
margin-top: 20px;
color: white;
font-size: 12px;
cursor: default;
line-height:normal;
}
#lightbox-overlay-text a, #lightbox-overlay-text a:hover, #lightbox-overlay-text a:visited, #lightbox-overlay-text a:link {
color:white;
}
#lightbox-overlay-text span {
padding-left:5px;
padding-right:5px;
}
#lightbox img, #lightbox a img, #lightbox a { border:none; outline:none; }
#lightbox-imageBox {
position:relative;
border:1px solid black;;
background-color:white;
width:400px;
height:400px;
margin:0 auto;
}
#lightbox-imageContainer {
padding:1px;
}
#lightbox-loading {
position:absolute;
top:40%;
left:0%;
height:25%;
width:100%;
text-align:center;
line-height:0;
}
#lightbox-nav {
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
z-index:10;
}
/* #lightbox-imageBox > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none; }*/
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
display:block;
width:49%;
height: 100%;
background:transparent url("../images/blank.gif") no-repeat; /* Trick IE into showing hover */
/* cursor:pointer; */
zoom:1; /* who knows why? */
padding:0px;
margin:0px;
}
#lightbox-nav-btnPrev {
left:0;
right:auto;
float:left;
}
#lightbox-nav-btnNext {
left:auto;
right:0;
float:right;
}
/*
.preload_largeLink, #prevLink:hover, #prevLink:visited:hover {
background:url("../images/prev.gif") left 45% no-repeat;
}
.preload_nextLink, #nextLink:hover, #nextLink:visited:hover {
background:url("../images/next.gif") right 45% no-repeat;
}
*/
#lightbox-infoBox {
font:10px Verdana, Helvetica, sans-serif;
background-color:#FFFFFF;
margin:0 auto;
padding:0px;
/* width: 100%;
padding: 0 10px 0; */
}
#lightbox-infoContainer {
padding-left:10px;
padding-right:10px;
padding-top:5px;
padding-bottom:5px;
color:#666;
line-height:normal;
/* height:30px; */
}
#lightbox-infoHeader {
width:100%;
text-align:center;
}
#lightbox-caption {
text-align:justify;
}
#lightbox-caption-title {
font-weight:bold;
}
#lightbox-caption-description {
font-weight:normal;
}
#lightbox-infoFooter {
margin-top:3px;
color:#999999;
}
#lightbox-currentNumber {
display:block;
width:49%;
float:left;
text-align:left;
}
#lightbox-close {
display:block;
width:45%;
float:right;
text-align:right;
}
#lightbox-close-button{
padding-left:30%;
}
#lightbox-close-button:hover {
color:#666666;
}
#lightbox-infoContainer-clear {
clear:both;
visibility:hidden;
}

View File

Before

Width:  |  Height:  |  Size: 43 B

After

Width:  |  Height:  |  Size: 43 B

View File

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
images/next.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
images/prev.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -209,9 +209,10 @@ function showPreview(&$thumbinfo) {
$scaledimagesize = getimagesize(realpath(GALLERYPREFIX .
DIRECTORY_SEPARATOR .
$scaledimage));
printf("<a href=\"%s\" class=\"lightbox\" ><img id=\"contentimg\" src=\"%s%s%s\" alt=\"%s\" %s /></a>",
$fullname, GALLERYPREFIX, DIRECTORY_SEPARATOR, $scaledimage,
getImageLabel($galleryname, $basename), $scaledimagesize[3]);
$label = getImageLabel($galleryname, $basename);
printf("<a class=\"lightbox\" title=\"%s\" href=\"%s\" rel=\"lightbox\"><img id=\"contentimg\" src=\"%s%s%s\" alt=\"%s\" %s /></a>",
$label, $fullname, GALLERYPREFIX, DIRECTORY_SEPARATOR,
$scaledimage, $label, $scaledimagesize[3]);
break;
}
}

View File

@ -51,13 +51,13 @@ $aquarelle = ($menu = 14);
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Bilderframework</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
<style type="text/css" media="./css/main.css"></style>
<link rel="stylesheet" href="./css/format.css" type="text/css" />
<link rel="stylesheet" href="./css/jquery.lightbox-0.4.css" type="text/css" />
<script src="./scripts/jquery.js" type="text/javascript" ></script>
<script src="./scripts/jquery.lightbox.js" type="text/javascript" ></script>
<script src="./scripts/ourhandlers.js" type="text/javascript" ></script>
<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" href="css/format.css" type="text/css" />
<link rel="stylesheet" href="css/jquery.lightbox.css" type="text/css" />
<script src="scripts/jquery.js" type="text/javascript" ></script>
<script src="js/jQuery.colorBlend.pack.js" type="text/javascript"></script>
<script src="js/jquery.lightbox.packed.js" type="text/javascript" ></script>
<script src="scripts/ourhandlers.js" type="text/javascript" ></script>
<style type="text/css">
<?php
printf("#scrollable { width:%dpx; }", $thumbinfo[0]);

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -59,6 +59,7 @@ function updateContentImage(pathParts) {
$("#content_main img").attr("alt", data["data"]);
$("#content_main img").attr("src", data["preview"]);
$("#content_main a").attr("href", data["full"]);
$("#content_main a").attr("title", data["data"]);
});
}
@ -122,5 +123,4 @@ $(document).ready(function() {
$("div.thumbnail img").mouseover(function() {
updateContentImage(getPathParts(this.src));
});
$("a.lightbox").lightBox();
});