Title: Infinite Scroll affecting CSS Javascript generated featured image
Last modified: May 8, 2018

---

# Infinite Scroll affecting CSS Javascript generated featured image

 *  Resolved [SAM](https://wordpress.org/support/users/samdlaw/)
 * (@samdlaw)
 * [8 years, 1 month ago](https://wordpress.org/support/topic/infinite-scroll-affecting-css-javascript-generated-featured-image/)
 * I’m using Dara theme (Child theme to change few parameters for color & font) 
   on my blog blog.avxio.com.
 * As per theme, it takes first image as the Featured image if not already defined.
   On first load it looks and works as expected. On scrolling (to invoke Infinite
   Scroll), next page is loaded onto the browser. However, if page is scrolled up
   again the generated featured image disappears.
 * Similar issue is also faced with other themes following similar principle (Baskervile
   2). I’ve tried using Developer in Firefox to see what happens (but not very proficient,
   though). The page source doesn’t change till the Featured Image post is in view(
   my assumption something to do with lazy load of Jetpack?). Can anyone help me
   out?
 * Additional pointers:
    1) Post with image has been knowingly made sticky to reflect
   the behaviour. Tried on Safari, Chrome & Firefox. 2) One of the image is from
   Flickr direct link to image and other is in Media saved in hosting
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Finfinite-scroll-affecting-css-javascript-generated-featured-image%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 6 replies - 1 through 6 (of 6 total)

 *  [Tracy](https://wordpress.org/support/users/tmmbecker/)
 * (@tmmbecker)
 * [8 years, 1 month ago](https://wordpress.org/support/topic/infinite-scroll-affecting-css-javascript-generated-featured-image/#post-10263551)
 * [@samdlaw](https://wordpress.org/support/users/samdlaw/) I am seeing the same
   thing that you’re seeing. When scrolling back up after invoking infinite scroll,
   the image links appear to be broken.
 * I suspect that this might be related to your theme specifically. Let’s first 
   verify your suspicion that this is related to Lazy Images. Could you disable 
   that to see if that fixes the problem?
 * Would you then enable Lazy Images again, switch to Twenty Seventeen temporarily
   and then check it again? If you don’t want to impact the front-end of your site,
   you can use this plugin:
 * [https://wordpress.org/plugins/theme-switcha/](https://wordpress.org/plugins/theme-switcha/)
 * Let us know what you find 🙂
 *  Thread Starter [SAM](https://wordpress.org/support/users/samdlaw/)
 * (@samdlaw)
 * [8 years, 1 month ago](https://wordpress.org/support/topic/infinite-scroll-affecting-css-javascript-generated-featured-image/#post-10263739)
 * [@tmmbecker](https://wordpress.org/support/users/tmmbecker/) It is indeed due
   to Lazy load option of Jetpack. Both theme and Jetpack are supported by Automattic,
   so was a hunch for Jetpack to be issue. Didn’t need to change themes 🙂
 * Removed all caching options to be sure. Refreshed page. Image link still breaks.
   As is state confirmed.
 * Disabled Lazy load in Jetpack. Refreshed page. Scrolled to load more. Scrolled
   up and image still persists (link doesn’t break). Tried 2 more times, just to
   be sure.
 * Reverted the settings and back to square one.
 *  Thread Starter [SAM](https://wordpress.org/support/users/samdlaw/)
 * (@samdlaw)
 * [8 years, 1 month ago](https://wordpress.org/support/topic/infinite-scroll-affecting-css-javascript-generated-featured-image/#post-10267422)
 * I really wish, I could investigate deep but I’m not very conversational with 
   the backend codes but it seems lazy load after processing the image marks a flag.
 * After processing the image, by tagging class as “jetpack-lazy-image–handled” &“
   data-lazy-src” Jetpack seems to identify the image has been processed. Once the
   view port changes, the script is rerun for next iterations and it seems to skip
   all entries marked as “data-lazy-src=1”. When we return to same viewport with
   image already loaded, “data-lazy-src=1” is set, hence the image processing is
   skipped but due to previous run the src is now 1 “src=1”. It tries to process“
   src=1”, which obviously is Image not found, it adds another html parameter “scale
   =0”.
 * It affects only the  tag and not the javascript, which already loaded on the 
   system.
 * All in all, a hypothesis.
 * Firefox, Developer shows below:
    **Before:**
 *     ```
       		<div class="post-thumbnail">
       			<a href="http://blog.avxio.com/2016/11/19/music-to-the-ears/">
       				<img src="https://i2.wp.com/farm6.staticflickr.com/5468/30738742760_5c42c7d4cf_b.jpg?resize=880%2C312&ssl=1&crop=1" title="Music to the ears" class="attachment-dara-featured-image wp-post-image jetpack-lazy-image--handled" data-lazy-src="1"><noscript><img src="https://i2.wp.com/farm6.staticflickr.com/5468/30738742760_5c42c7d4cf_b.jpg?resize=880%2C312&ssl=1&crop=1" title="Music to the ears" class="attachment-dara-featured-image wp-post-image" /></noscript>			</a>
       		</div>
       ```
   
 * **After**
 *     ```
       		<div class="post-thumbnail">
       			<a href="http://blog.avxio.com/2016/11/19/music-to-the-ears/">
       				<img src="1" title="Music to the ears" class="attachment-dara-featured-image wp-post-image jetpack-lazy-image--handled" data-lazy-src="1" scale="0"><noscript><img src="https://i2.wp.com/farm6.staticflickr.com/5468/30738742760_5c42c7d4cf_b.jpg?resize=880%2C312&ssl=1&crop=1" title="Music to the ears" class="attachment-dara-featured-image wp-post-image" /></noscript>			</a>
       		</div>
       ```
   
 *  [Tracy](https://wordpress.org/support/users/tmmbecker/)
 * (@tmmbecker)
 * [8 years, 1 month ago](https://wordpress.org/support/topic/infinite-scroll-affecting-css-javascript-generated-featured-image/#post-10267658)
 * Great troubleshooting! Thank you so much for the detailed report.
 * Another Jetpack user actually identified this same bug just a bit ago and reported
   it here:
 * [https://github.com/Automattic/jetpack/issues/9527](https://github.com/Automattic/jetpack/issues/9527)
 * They even created a fix that we’ll include in the next release.
 * In the meantime, you can either keep Lazy Images disabled until the next version
   of Jetpack comes out in two weeks or you can edit the line in modules/lazy-images/
   js/lazy-images.js as well as the minified versions of those files.
 * I hope that helps!
 *  Thread Starter [SAM](https://wordpress.org/support/users/samdlaw/)
 * (@samdlaw)
 * [8 years, 1 month ago](https://wordpress.org/support/topic/infinite-scroll-affecting-css-javascript-generated-featured-image/#post-10270470)
 * Thanks [@tmmbecker](https://wordpress.org/support/users/tmmbecker/). That indeed
   solved the problem.
 * Updated the /modules/lazy-images/js/lazy-images.js & _inc/build/lazy-images/js/
   lazy-images.min.js and voila!
 * Awaiting for official release 🙂
 *  [Tracy](https://wordpress.org/support/users/tmmbecker/)
 * (@tmmbecker)
 * [8 years ago](https://wordpress.org/support/topic/infinite-scroll-affecting-css-javascript-generated-featured-image/#post-10278245)
 * Thanks for letting me know. Glad to hear it!
 * You can expect the official release before the end of the month 🙂

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Infinite Scroll affecting CSS Javascript generated featured image’ is
closed to new replies.

 * ![](https://ps.w.org/jetpack/assets/icon.svg?rev=2819237)
 * [Jetpack - WP Security, Backup, Speed, & Growth](https://wordpress.org/plugins/jetpack/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/jetpack/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/jetpack/)
 * [Active Topics](https://wordpress.org/support/plugin/jetpack/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/jetpack/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/jetpack/reviews/)

 * 6 replies
 * 2 participants
 * Last reply from: [Tracy](https://wordpress.org/support/users/tmmbecker/)
 * Last activity: [8 years ago](https://wordpress.org/support/topic/infinite-scroll-affecting-css-javascript-generated-featured-image/#post-10278245)
 * Status: resolved