marniedevries Posted April 3, 2020 Share Posted April 3, 2020 Hello, I created a web page using Squarespace 7.1 that has several carousels that have CSS display:none on page load. I then have jQuery code that toggles those blocks on/off when some type of widget is selected. The thumbnails for those blocks are not correct once they are turned on - the images are stretched and are not the correct thumbnail size. If I change the code and have the blocks start as display:block on page load, then use the jQuery widget to toggle the images are fine. The problem only happens when the blocks are initially hidden with display:none. I'm new to squarespace but I'm thinking maybe it's some type of issue where the imageloader is not pre-loading the thumbnails or something since those carousel blocks are gone. If I need to trigger the load of the thumbnails for the hidden elements when the event fires ....well..i have no idea how to do that. Can anyone assist? Here's a super simplified version of my code - still illustrates the issue. Thanks! <script> $( document ).ready(function() { $("button").click( function( event ) { $(".sqs-block-summary-v2").toggle(); }); }); </script> <style> .sqs-block-summary-v2 { display: none; } </style> <button> press me </button> Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.