Skip Navigation

[Resolved] View infinite scroll product images not visible

This thread is resolved. Here is a description of the problem and solution.

Problem:

The initial view loads correctly but, the the infinite scroll triggers, the subsequent product don't have images displayed.

Solution:

It seems your website is using JS/CSS codes to setup the product item div tag's "opacity" CSS attribute value to 0, and it conducts the problem.

In your case, you can setup CSS codes to set the CSS attribute "opacity" to 100, and test again.

Relevant Documentation:

https://www.w3schools.com/cssref/css3_pr_opacity.asp

This support ticket is created 4 years, 8 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

This topic contains 2 replies, has 2 voices.

Last updated by JamesS2731 4 years, 8 months ago.

Assisted by: Luo Yang.

Author
Posts
#1732047

Tell us what you are trying to do? create an infinite carolling product grid view. The initial view loads correctly but, the the infinite scroll triggers, the subsequent product don't have images displayed. They are shown in the page code though.

Is there any documentation that you are following? Multiple sources.

Is there a similar example that we can see? Indeed - hidden link

What is the link to your site? hidden link

As always, any thoughts or ideas most welcomed.

Kind regards
James

#1732797
opacity.JPG

Dear James,

Thanks for the details, I can see the problem in your website, it should be a CSS/JS problem, it seems your website is using JS/CSS codes to setup the product item div tag's "opacity" CSS attribute value to 0, and it conducts the problem you mentioned above, see my screenshot: opacity.JPG

In your case, you can setup CSS codes to set the CSS attribute "opacity" to 100, and test again.

More help:
hidden link

#1733657

Many thanks Luo, that;'s perfect. All fixed now!

Kind regards
James