simplify and cleanup large portal image dialog
- nicely centered. few tricky css hacks - minumum width - ready for additional content below the image - fix & in portal titles from showing as & sequence, etc
This commit is contained in:
parent
2d247322f9
commit
b0675e5852
17
code/boot.js
17
code/boot.js
@ -9,19 +9,14 @@ window.showZoom = true;
|
|||||||
window.setupLargeImagePreview = function() {
|
window.setupLargeImagePreview = function() {
|
||||||
$('#portaldetails').on('click', '.imgpreview', function() {
|
$('#portaldetails').on('click', '.imgpreview', function() {
|
||||||
var img = $(this).find('img')[0];
|
var img = $(this).find('img')[0];
|
||||||
var w = img.naturalWidth, c = $('#portaldetails').attr('class');
|
//dialogs have 12px padding around the content
|
||||||
var d = dialog({
|
var dlgWidth = Math.max(img.naturalWidth+24,400);
|
||||||
html: '<span class="' + c + '" style="position: relative; width: 100%; left: 50%; margin-left: ' + -(w / 2) + 'px;">' + img.outerHTML + '</span>',
|
dialog({
|
||||||
title: $(this).parent().find('h3.title').html()
|
html: '<div style="text-align: center">' + img.outerHTML + '</div>',
|
||||||
|
title: $(this).parent().find('h3.title').text(),
|
||||||
|
width: dlgWidth,
|
||||||
});
|
});
|
||||||
|
|
||||||
// We have to dynamically set the width of this dialog, so get the .ui-dialog component
|
|
||||||
var p = d.parents('.ui-dialog');
|
|
||||||
|
|
||||||
// Don't let this dialog get smaller than the default maximum dialog width
|
|
||||||
var width = Math.max(parseInt(p.css('max-width')), w);
|
|
||||||
p.css('min-width', width + 'px');
|
|
||||||
p.css('width', width + 'px');
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user