first attempt for item-option-overlay
This commit is contained in:
parent
d024eba878
commit
9a937a1aa2
17
css/pear.css
17
css/pear.css
|
@ -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;
|
||||
|
|
43
js/pear.js
43
js/pear.js
|
@ -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() {
|
||||
|
|
|
@ -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>
|
||||
|
|
Reference in New Issue
Block a user