Archived topic
Excerpt Action Hook
38 replies · Started by Andy on June 2, 2019
No joy I'm afraid, still only works on posts above the load more button.
Can you share a link to your site so i can see whats happening with the infinite scroll and the toggle wrapper?
I'm developing locally using Local by Flywheel, I've added a public URL to my original post, but this will expire after a few hours, so hope it will be live long enough for you to see it.
Hmmm looks good to me:
https://www.loom.com/share/9a5b95af71c24b9c822f44058cee0c0b
Tested on Chrome, Firefox and Safari - all passed the test.
You need to test posts that are loaded from Infinite Scroll, such as '5 Dales Route, Peak District'.
Apologies the posts weren't loading due the tunnel failing so didn't notice they hadn't changed. Not sure but could you try this instead:
jQuery('.generate-columns-container').on('click', '.accordion-toggle', function (event)
{
event.preventDefault();
jQuery(this).next().slideToggle('fast');
//Hide the other panels
jQuery(".accordion-content").not(jQuery(this).next()).slideUp('fast');
//Switch toggle
jQuery('.accordion-toggle.toggle-open').not(this).removeClass('toggle-open');
jQuery(this).toggleClass('toggle-open');
});
Excuse my poor jquery knowledge but does that need to go between <script> tags? as on it's own it just displays the code on the front-end.
Oops - yes within the Script tags
Hmmmmm, unfortunately not working at all now, not even on the posts loaded before infinite scroll.
Worth a try - can you remove the JS ( leave the CSS ) and if the tunnel is still open then i can take a look in the dev tools.
ok done, live link should still be working.
Try this function:
jQuery( document ).ready( function($) {
var $container = $( '#main article' ).first().parent();
toggleFunction();
$container.on( 'append.infiniteScroll', function( event, response, path, items ) {
toggleFunction();
} );
function toggleFunction() {
$('.inside-article').on('click', '.accordion-toggle', function (event)
{
event.preventDefault();
$(this).next().slideToggle('fast');
//Hide the other panels
$(".accordion-content").not($(this).next()).slideUp('fast');
//Switch toggle
$('.accordion-toggle.toggle-open').not(this).removeClass('toggle-open');
$(this).toggleClass('toggle-open');
});
}
});
Almost there! - It's working perfectly on posts loaded by Infinite Scroll, but on posts loaded on page load when you click the accordion it opens and then quickly closes by itself.
So if you only have infinite scroll on ( no load more ) then on page load they open and immediately close?
No, after pressing the load more button, the posts positioned above the load more button open and then close immediately, whereas posts positioned below the #nav-below container behave correctly.