How do I fix missing images in mobile browsers?

  • Hi guys,

    First time posting in the forum, I have been making my game (Time Warp) on and off for over a year.

    I finally finished the game last week and I have been going through the process of getting the game ready to publish online to various platforms (GameJolt etc)

    My game is currently being hosted at this link https://ludusgames.000webhostapp.com/

    This is a free hosting website which I am using for testing purposes.

    Now my game works perfectly on desktop/laptop browsers however if the game is texted on mobile (I have tried opening it on Chrome, Safari and as a Web App) for some reason one of my background images doesn't load up.

    I have three layers (UI, Game and Background) and I have tried having the image on both Game and Background - the image moves left during the game and I therefore can't have it on the UI layer.

    I have two scrolling images, one being the sky and one being the level specific background with scenery. The sky loads and moves perfectly on mobile and is on the background layer.

    All of my other items such as powerups and the player are on the game layer and they also load perfectly.

    I have been pulling my hair out trying to figure this one out and I am hoping one of you can help!

    Cheers,

    Brian

    *** EDIT

    Controls

    Mobile: Touch control buttons

    Browser: WASD

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • The largest widely supported image size is 2048x2048. Construct should have warned you if you tried to use larger images. Your project uses larger images - I found one which is 4206x1300, which will require support for 8192x8192 images, which AFAICT only around 25% of devices support. Those images will fail to load on devices that do not support images that large. You need to use smaller images.

  • Thank you so much! :)

  • The largest widely supported image size is 2048x2048. Construct should have warned you if you tried to use larger images. Your project uses larger images - I found one which is 4206x1300, which will require support for 8192x8192 images, which AFAICT only around 25% of devices support. Those images will fail to load on devices that do not support images that large. You need to use smaller images.

    Thank you for your help so far! Just one more quick question; my sky background (which loads on mobile fine) is 2103x700 and the scenery image (which does not load on mobile) is 2103x380.

    Could this mean in my case that there is something else stopping the image loading?

    The way I set my game up is with the sky and scenery on screen and a second copy of each image off screen (this is maybe where you got the 4206x1300 from. I then scroll both images to the left and when the first image is completely off screen I move it way over to the right to make a continuous loop.

    If both didn't work it would make sense to me. But i literally do the same process for the sky and the scenery and only the scenery isn't loading.

    Thanks again!

    Brian

  • 2103 is larger than 2048, so you still can't guarantee those images will load on all devices.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)