github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-27 14:53:37 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

add lightbox extra-zoom on click

Browse Source
This commit is contained in:
Régis Hanol 2013-12-02 11:03:47 +01:00
parent bfd2fd8607
commit 3842097698
2 changed files with 33 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
app/assets/javascripts/discourse/lib/lightbox.js
View File

@ -8,14 +8,32 @@
Discourse.Lightbox = {
apply: function($elem) {
$LAB.script("/javascripts/jquery.magnific-popup-min.js").wait(function() {
$('a.lightbox', $elem).each(function(i, e) {
$("a.lightbox", $elem).each(function(i, e) {
$(e).magnificPopup({
type: 'image',
closeOnContentClick: true,
type: "image",
closeOnContentClick: false,
callbacks: {
open: function() {
var self = this,
wrap = this.wrap,
img = this.currItem.img,
maxHeight = img.css("max-height");
wrap.on("click.pinhandler", "img", function() {
wrap.toggleClass("mfp-force-scrollbars");
img.css("max-height", wrap.hasClass("mfp-force-scrollbars") ? "none" : maxHeight);
});
},
beforeClose: function() {
this.wrap.off("click.pinhandler");
this.wrap.removeClass("mfp-force-scrollbars");
}
},
image: {
titleSrc: function(item) {
return item.el.attr('title') + ' &middot; <a class="image-source-link" href="' + item.src + '" target="_blank">' + I18n.t("lightbox.download") + '</a>';
return item.el.attr("title") + ' &middot; <a class="image-source-link" href="' + item.src + '" target="_blank">' + I18n.t("lightbox.download") + '</a>';
}
}

11
app/assets/stylesheets/desktop/magnific-popup.scss
View File

@ -639,3 +639,14 @@ button {
}
}
}
.mfp-force-scrollbars {
&.mfp-wrap {
overflow-y: auto !important;
overflow-x: auto !important;
}
.mfp-img {
max-width: none;
}
}