avoid flickering img-responsives
This commit is contained in:
parent
98aaaece28
commit
0364e4b1bc
|
@ -27,11 +27,11 @@
|
||||||
|
|
||||||
<!-- thanks https://www.godo.dev/tutorials/hugo-image-figure-wrap/ -->
|
<!-- thanks https://www.godo.dev/tutorials/hugo-image-figure-wrap/ -->
|
||||||
{{ $reAltIn := "<p><img src=\"([^\"]+)\" alt=\"([^\"]*)\" /></p>" }}
|
{{ $reAltIn := "<p><img src=\"([^\"]+)\" alt=\"([^\"]*)\" /></p>" }}
|
||||||
{{ $reAltOut := "<figure><a href=\"$1\" class=\"lbox\"><img src=\"$1\" alt=\"$2\"></a></figure>" }}
|
{{ $reAltOut := "<figure><a href=\"$1\" class=\"lbox\"><img class=\"img-responsive\" src=\"$1\" alt=\"$2\"></a></figure>" }}
|
||||||
{{ $altContent := .Content | replaceRE $reAltIn $reAltOut | safeHTML }}
|
{{ $altContent := .Content | replaceRE $reAltIn $reAltOut | safeHTML }}
|
||||||
|
|
||||||
{{ $reAltTitleIn := "<p><img src=\"([^\"]+)\" alt=\"([^\"]*)\" title=\"([^\"]+)\" /></p>" }}
|
{{ $reAltTitleIn := "<p><img src=\"([^\"]+)\" alt=\"([^\"]*)\" title=\"([^\"]+)\" /></p>" }}
|
||||||
{{ $reAltTitleOut := "<figure><a href=\"$1\" class=\"lbox\"><img src=\"$1\" title=\"$3\"></a><figcaption>$3</figcaption></figure>" }}
|
{{ $reAltTitleOut := "<figure><a href=\"$1\" class=\"lbox\"><img class=\"img-responsive\" src=\"$1\" title=\"$3\"></a><figcaption>$3</figcaption></figure>" }}
|
||||||
{{ $finalContent := $altContent | replaceRE $reAltTitleIn $reAltTitleOut | safeHTML }}
|
{{ $finalContent := $altContent | replaceRE $reAltTitleIn $reAltTitleOut | safeHTML }}
|
||||||
|
|
||||||
{{ $finalContent }}
|
{{ $finalContent }}
|
||||||
|
|
|
@ -1,15 +1,11 @@
|
||||||
$(function() {
|
$(function() {
|
||||||
|
|
||||||
var addResponsiveTagToContentImages = function() {
|
|
||||||
$("img").addClass("img-responsive");
|
|
||||||
};
|
|
||||||
var disableResponsiveImagesForInlineLis = function() {
|
var disableResponsiveImagesForInlineLis = function() {
|
||||||
$('li img.img-responsive').each(function() {
|
$('li img.img-responsive').each(function() {
|
||||||
$(this).removeClass('img-responsive');
|
$(this).removeClass('img-responsive');
|
||||||
$(this).css('border', 'none');
|
$(this).css('border', 'none');
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
addResponsiveTagToContentImages();
|
|
||||||
disableResponsiveImagesForInlineLis();
|
disableResponsiveImagesForInlineLis();
|
||||||
|
|
||||||
const box = new SimpleLightbox('.lbox', { /* options */ });
|
const box = new SimpleLightbox('.lbox', { /* options */ });
|
||||||
|
|
Loading…
Reference in New Issue