|
Re:Back button on Deeplink goes to previous page 2 Years, 3 Months ago
|
Karma: 0
|
Hi ARI Soft,
Although script fragment you have recommended works great on pages that use the lightbox, it also seems to be messing up behavior for generic anchor links.
See www.estherjansen.com/fotos/#ib-toc-anchor-2 , for example (or go to the page without the anchor, and click on a link in the table of contents).
Here, the browser first correctly scrolls down to the anchor further up on the page, but then goes back to the previous page.
How can the script you provided be modified so that it doesn't interfere with other anchor links?
Thank you! |
|
|
|
|
|
|
Re:Back button on Deeplink goes to previous page 8 Months, 3 Weeks ago
|
Karma: 0
|
|
Hi ARI soft team,
I have tried contacting you on the Contact page for a solution, but I don't think the form works...
Unfortunately I am still having this issue with page anchors like the ones generated with a TOC plugin as explained above: pressing an anchor link causes the browser to go back in history one page instead of jumping to the anchor position.
How can the last code suggestion you gave me in this thread be improved to still close a Fancybox when pressing the back button, but behave normally when using a link to an page anchor?
|
|
|
|
|
|
|
Re:Back button on Deeplink goes to previous page 5 Months, 1 Week ago
|
Karma: 0
|
Since adding the following code mentioned on page 1, it breaks linking to image hash when loading an image URL:
| Code: |
if ('scrollRestoration' in history) {
history.scrollRestoration = 'manual';
}
if (!history.state || !history.state.fakeLightbox || history.state.path !== window.location.pathname) {
history.pushState({fakeLightbox: true, path: window.location.pathname}, null, window.location.pathname);
}
window.addEventListener('popstate', function(e) {
var isActive = !!$.fancybox.getInstance();
if (isActive) {
history.pushState({fakeLightbox: true, path: window.location.pathname}, null, window.location.pathname);
$.fancybox.close();
} else {
history.go(-1);
}
});
|
At first I thought it was just me. But then I saw the following image hash turns from:
www.estherjansen.com/fotos/#!lightbox/e6d3b13d/DEF-0424-bruiner-fotofloor300518.jpg
To:
www.estherjansen.com/fotos/
The lightbox doesn't open from URL hash when adding back button support. Is there a work around? |
|
|
|
Last Edit: 2024/10/20 05:17 By Josh.
|
|
|
Re:Back button on Deeplink goes to previous page 5 Months, 1 Week ago
|
Karma: 763
|
Hello,
Try to use the following code instead of the previous one:
| Code: |
if ('scrollRestoration' in history) {
history.scrollRestoration = 'manual';
}
if (!history.state || !history.state.fakeLightbox || history.state.path !== window.location.pathname) {
history.pushState({fakeLightbox: true, path: window.location.pathname}, null, window.location.pathname);
}
window.addEventListener('popstate', function(e) {
var isActive = !!$.fancybox.getInstance();
if (isActive) {
history.pushState({fakeLightbox: true, path: window.location.pathname}, null, window.location.pathname);
$.fancybox.close();
} else {
if (!location.hash || location.hash.indexOf('#!lightbox/') !== 0)
history.go(-1);
}
});
|
Regards,
ARI Soft |
|
|
|
|
|
|
Re:Back button on Deeplink goes to previous page 5 Months, 1 Week ago
|
Karma: 0
|
Reply appreciated. I feel we are getting closer. 
With the new code I have the same result as above. Upon testing out variations of the code, when only using the following JS it removes the imagebox/hash:
| Code: |
if (!history.state || !history.state.fakeLightbox || history.state.path !== window.location.pathname) {
history.pushState({fakeLightbox: true, path: window.location.pathname}, null, window.location.pathname);
}
|
When simplifying it further (to just the single line of code) this too removes the imagebox/hash:
| Code: |
history.pushState({fakeLightbox: true, path: window.location.pathname}, null, window.location.pathname);
|
So it would appear the issue is on the 5th line of the JS code. When using your latest JS code but stripping out the following JS, the linked image.jpg imagebox/hash works but doesn't have the back button support:
| Code: |
if (!history.state || !history.state.fakeLightbox || history.state.path !== window.location.pathname) {
history.pushState({fakeLightbox: true, path: window.location.pathname}, null, window.location.pathname);
}
|
|
|
|
|
Last Edit: 2024/10/21 17:56 By Josh.
|
|
|
Re:Back button on Deeplink goes to previous page 5 Months, 1 Week ago
|
Karma: 763
|
|
The old code is on the page so we can't check this.
Regards,
ARI Soft
|
|
|
|
|
|
|
