Comments (1)
I agree with you, @godfatherjohn. This is very good work by @miromannino
I have a patch (below) to enable you to invoke the "last-row" code on any gallery line. You request this with the code class="end-of-row"
on the a
object:
<div id="liveDemo">
<a href="/Justified-Gallery/photos/24096687789_c37d45712f_b.jpg" class="end-of-row">
<img alt="Peace of mind" src="/Justified-Gallery/photos/24096687789_c37d45712f_m.jpg"/>
</a>
<a href="/Justified-Gallery/photos/23753792354_bd75d8dabc_b.jpg">
<img alt="Abu Dhabi" src="/Justified-Gallery/photos/23753792354_bd75d8dabc_m.jpg"/>
</a>
</div>
Here's my patch $ diff jquery.justifiedGallery.js jquery.justifiedGallery.orig.js
Usual excuses and guarantees: it works for me! https://clanmills.com/2023/Runs/CaesarsCamp/
@miromannino Please consider refining/polishing/integrating this capability into a future release of your library.
369d368
< * @param endOfRow undefined or false for normal behavior. endOfRow = true to pack and display row.
372c371
< JustifiedGallery.prototype.prepareBuildingRow = function (isLastRow, hiddenRow,endOfRow) {
---
> JustifiedGallery.prototype.prepareBuildingRow = function (isLastRow, hiddenRow) {
382c381
< if (hiddenRow || ((isLastRow||endOfRow) && this.settings.lastRow === 'hide' && !justifiable)) {
---
> if (hiddenRow || (isLastRow && this.settings.lastRow === 'hide' && !justifiable)) {
396c395
< if ((isLastRow||endOfRow) && !justifiable && this.settings.lastRow !== 'justify' && this.settings.lastRow !== 'hide') {
---
> if (isLastRow && !justifiable && this.settings.lastRow !== 'justify' && this.settings.lastRow !== 'hide') {
433c432
< JustifiedGallery.prototype.flushRow = function (isLastRow, hiddenRow,endOfRow) {
---
> JustifiedGallery.prototype.flushRow = function (isLastRow, hiddenRow) {
437,438c436,437
< buildingRowRes = this.prepareBuildingRow(isLastRow, hiddenRow,endOfRow);
< if (hiddenRow || ((isLastRow||endOfRow) && settings.lastRow === 'hide' && buildingRowRes === -1)) {
---
> buildingRowRes = this.prepareBuildingRow(isLastRow, hiddenRow);
> if (hiddenRow || (isLastRow && settings.lastRow === 'hide' && buildingRowRes === -1)) {
448c447
< if ((isLastRow||endOfRow) && (settings.lastRow === 'center' || settings.lastRow === 'right')) {
---
> if (isLastRow && (settings.lastRow === 'center' || settings.lastRow === 'right')) {
473c472
< if (!isLastRow || (this.buildingRow.height <= settings.rowHeight && buildingRowRes) || endOfRow) {
---
> if (!isLastRow || (this.buildingRow.height <= settings.rowHeight && buildingRowRes)) {
794d792
< var endOfRow = $entry[0].classList.contains('end-of-row');
804d801
< var hidden = this.settings.maxRowsCount > 0 && this.rows === this.settings.maxRowsCount;
807c804
< this.flushRow(false, hidden,false);
---
> this.flushRow(false, this.settings.maxRowsCount > 0 && this.rows === this.settings.maxRowsCount);
813,814d809
< } else if ( endOfRow ) { // force endOfRow
< this.flushRow(false, hidden,endOfRow);
823c818
< this.flushRow(true, false,false);
---
> this.flushRow(true, this.settings.maxRowsCount > 0 && this.rows === this.settings.maxRowsCount);
from justified-gallery.
Related Issues (20)
- Is it posibble to dynamically change the row height on page resize? HOT 1
- Borders and paddings for images HOT 29
- How to use in Angular 2+
- Error handling
- Lazy loading images HOT 1
- WebP support HOT 3
- Grammar: "Justified Gallery is a JavaScript library that allows you to create an high quality justified gallery of images."
- dist/css/justifiedGallery.min.css is not minified
- Lazyloaded images are not rendered on Firefox
- sizeRangeSuffixes doesn't work if the preview is embedded using base64 encoding
- Separate row height for smartphone/mobile devices HOT 4
- Many pictures are loaded but not shown.
- Multiple containers and jumping scroll position
- Is it possible to set breakpoints for different rowHeights? HOT 1
- I can't embed videos in a href tag
- Howto unhide lastrow = hide?
- page freeze
- Additional features!
- How to get it to work with ES6 Modules (if you're finding it isn't working)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from justified-gallery.