I am using the view core module to view the featured articles, latest articles and more stuff in my project, it is rendering 3 articles and the load more button to load more content using ajax, This is working great in Desktop, However in Mobile, the load more button doesn't exist (As per website design) and the articles are displayed in a slider. I am hiding load more button using CSS, the user has no way of loading more content!!
1st Approach: Load more content using ajax.
How can I automatically load more content after the user slides 2 or more slides ? I can easily detect when the user slides to the 2nd slide using jquery but how can I load more slides dynamically using ajax? Do I have to load more content by myself or does Drupal 8 have a way of doing this?
2nd Approach: Make 2 blocks, one for desktop, one for mobile.
I thought of doing 2 separate views blocks:
Desktop view block: 3 items and load more button
Mobile view block: all items
But this doesn't feel right, and I will have to toggle between them using CSS which means the content will be fetched by network anyway, So this approach is not correct.
I could not find how to hide or show a block depending on view width without CSS.
If there is another approach please tell me.