Image jumps when loading website page 
Автор: Guillermo A.Hello,
I have just uploaded my website (guillermoalgora.com) and I notice a 'images jumping' effect on some of the pages. Please, go to Main page (https://guillermoalgora.com/index.php) and you will see how the coloured image jumps before setting in its final position. If you go to Showreel (https://guillermoalgora.com/showreel---main.html) a similar effect occurs. The background image (in yellow) gets cut off and you can see a hard line before it settles in its final position.
Is there a way that this can get mitigated? I imagine it's because the computer loads the image and then repositions it, but it makes the site to look really unprofessional. Because these images are set using either 'Row Format' or 'Page Properties/Graphic/Page Background/Enable Custom Settings' there is no way I could set a fade in effect (0 to 1) which may help to not see the picture at the beginning until it's settles in.
Please, any help is appreciated on this.
Thank you.
Try making the content of the page less - so there is no scrolling needed.
How is your layout for the row-format?
Автор
I have realized it only happens with Row Format and not with 'Page Properties/Graphic/Page Background/Enable Custom Settings.
Unfortunately reducing the content of the page is not an option.
My layout is as follows:
OK - so using background image for the page is not an option.
As the background is white also for the image could you not try to "unlock" the last row - or maybe the last 2 or 3 rows?
Автор
Unfortunately it doesn't help. Using background image for the page (Page Properties/Graphic/Page Background/Enable Custom Settings) is definitely an option but I whish I could make use of 'Row Format' without it causing a lot of issues when loading. Basically makes this feature almost unusable. I have updated the site, if you go to R&D / BLOG (https://guillermoalgora.com/blog-r-d---main.html) I have used 'Row Format' and there is again more jumping of the format... sigh
Thank you so much for your help.
Автор
Is there a chance to perhaps do a fade-in of some short in the ´Row Format´ to disguise the bug in the loading process? Maybe if I use a fade-in GIF as image could work, but seems an overkill to me to have to make a GIF for every new top row in that page.
Could that be coded somehow?
Автор
I think this feature needs a proper fix...
Guillermo, can you attach the background rainbow image to a post?
I suspect the issue would be mitigated if it could be resampled down in size and may also be better displayed using a different placement (I suspect you have selected fit to window)
Автор
Hello Esahc,
Attached the rainbow image. Yes, is using ´Fit to Window´ I suspect it could be mitigated like that, but what about BLOG / R&D what is jumping is the ´Row Format´ which is a built-in Gradient.
Guillermo on my pc (firefox) the background image on BLOG / R&D does not jump (even with ctrl+F5 to clear cache and reload) although I note the text (?) object changes size (although I do not find this distracting at all, the effect is rather good). I will look at your rainbow on my PC tomorrow and try various scenarios.
Автор
The background image does not jump because uses 'Page Properties/Graphic/Page Background/Enable Custom Settings'. I was referring to the text object 'Row Format' that you have noticed. Although in this particular case it may not be too ofensive, I think we can agree that this is not the desirable outcome or what the user is looking for. Although I love an appreciate all help, don't take me wrong, I wonder why is so hard to acknowledge when a feature does not work as it should. In the case of images, I can buy that the issue may be related to image size or other under the hood issues, but in this case (issue at BLOG / R&D) we are talking about a built-in Gradient.
So far, of all the 'Row Format' I have been trying I always get this type of 'jumping' size change, whether is with an external image or a built-in function). I appreciate immensely your help to find a workaround but le'ts call a spade a spade.
(It > De) ops! (It > En) ... ... yes, it would be possible to obtain it with my invention with EXTRA code ...
... if you are familiar with the Expert section, and if you are interested in a delayed fade effect for the background of the lines (FadeIn), ... you notify me, ... so then I will post the code ...
.
ciao
.
Автор
Hello KolAsim,
I would love to implement that. Although I am not familiar at all with the 'Expert' tab, I am thankfully familiar with programming so I guess should be able to pull it off eventually with some help. I'll be waiting for the code and hopefully some instructions. Thank you!
... OK ... the code is to be copied and pasted in this section:
>> Step 3 - Map> Page Properties > Expert section | ▪ Custom Code: 3^ option > Before closing the HEAD tag...
... you need to adjust the delay seconds, now set to 3 (three) seconds:
ritardoK = 3;
... code:
<!-- FadeIn sfondo righe by KolAsim -->
<style>
div[id^='imPageRowGraphics_'] {display:none }
</style>
<script>
$( document ).ready(function() { //K>;
ritardoK = 3; // nr. di secondi di ritardo, da valutare;<==K==
setTimeout(function(){ //K1>;
$("div[id^='imPageRowGraphics_'] ").fadeIn(1000);
}, ritardoK * 1000); //K1<<;
});//K<<;
</script>
<!-- end FadeIn -->
.
ciao
.
Автор
Thank you so much! the delay is working perfectly and getting rid of the undesired size 'jump'.
...
...
Автор
I think this solves my issue so far... However, it may not solve other user issues with it. I think Incomedia should take a proper look at this issue and I will submit a bug report, but if a member from the development team can be pinged to this conversation that would be great. Moreover, adding this delay feature to the software would be a great addition to be honest.
Автор
Thank you Esahc and KolAsim for your assistance.
... thanks to you for testing and feedback ...
...
... the delay of half a second is perhaps a little short ...ciao...
.