1
0

first attempt for item-option-overlay

This commit is contained in:
Fredrik Erlandsson 2011-11-14 15:04:06 +01:00
parent d024eba878
commit 9a937a1aa2
3 changed files with 64 additions and 1 deletions

View File

@ -1,3 +1,20 @@
body {
overflow: hidden;
}
.g-hover-item {
border: 1px solid #000;
position: absolute !important;
z-index: 1000 !important;
display: block;
}
#g-place-holder {
position: relative;
visibility: hidden;
z-index: 1;
}
.gallery-thumb {
float: left;
padding: 3px 5px 7px 5px;

View File

@ -494,6 +494,49 @@ function bodyLoad(vm, bgcolor) {
$('#loading').hide();
window.setTimeout("preFetch()", 500);
setKeys();
// Initialize thumbnail hover effect
$(".g-item").hover(
function() {
if(mosaicView) { return; }
// Insert a placeholder to hold the item's position in the grid
var placeHolder = $(this).clone().attr("id", "g-place-holder");
$(this).after($(placeHolder));
// Style and position the hover item
var position = $(this).position();
$(this).css("top", position.top).css("left", position.left);
$(this).addClass("g-hover-item");
// Initialize the contextual menu
$(this).gallery_context_menu();
// Set the hover item's height
$(this).height("auto");
var context_menu = $(this).find(".g-context-menu");
var adj_height = $(this).height() + context_menu.height();
if ($(this).next().height() > $(this).height()) {
$(this).height($(this).next().height());
} else if ($(this).prev().height() > $(this).height()) {
$(this).height($(this).prev().height());
} else {
$(this).height(adj_height);
}
},
function() {
if(mosaicView) { return; }
// Reset item height and position
if ($(this).next().height()) {
var sib_height = $(this).next().height();
} else {
var sib_height = $(this).prev().height();
}
if ($.browser.msie && $.browser.version >= 8) {
sib_height = sib_height + 1;
}
$(this).css({"height": sib_height, "position": "", "top": "", "left": ""});
// Remove the placeholder and hover class from the item
$(this).removeClass("g-hover-item");
$("#g-place-holder").remove();
}
);
}
function preFetch() {

View File

@ -40,10 +40,12 @@ $(function() {
<? endif ?>
<? if ($child->has_thumb()): ?>
<?= $child->thumb_img(array("class" => $img_class, "id" => "thumb_$child->id", "style" => "width: 200px; height 200px;")) ?>
<? else: ?>
<span style="display: block; width: 200px; height: 200px;"></span>
<? endif ?>
<? if ($child->is_movie()): ?>
<span class="p-video"></span>
<? endif ?>
<? endif ?>
<?// Begin skimming
if($child->is_album()):
$granchildren = $child->viewable()->children();
@ -59,6 +61,7 @@ if($child->is_album()):
endforeach;
endif;
// End skimming // ?>
<?= $theme->context_menu($child, "#g-item-id-{$child->id} .g-thumbnail") ?>
<p class="giTitle <? if(!$child->is_album()) print 'center';?>"><?= html::purify(text::limit_chars($child->title, 20)) ?> </p>
<? if($child->is_album()): ?><div class="giInfo"><?= count($granchildren)?> photos</div><? endif ?>
</div>