Conditional hidden images quickly shows during the initial load of the form

  • centerweb
    Asked on November 27, 2014 at 10:11 AM

    I have a conditional so my images are shown only if hidden; however there seems to be a delay between the load time and when the hidden field (based on the conditional) is shown, so that all the images will show and then immediately afterwards they will be hidden.  Is there some fix to prevent this unprofessional look, since it looks sloppy to have the images load first and be visible, and then be hidden according to my conditionals even if it is for a very short time.

  • Elton Support Team Lead
    Replied on November 27, 2014 at 1:00 PM

    Hi,

    I check your forms but I can't seem to reproduce the problem. I understand that you want the hidden fields to be perfectly hidden on the initial load of the page. May we know if it's happening on the stand alone form or on the embedded form? If it's on the embedded form, try to embed your form using the full source code, it might help improve the performance of the form since the HTML source is no longer called from the Jotform server. May I also suggest to clear your browser's cache and try it again, it might somehow help.

    Note that Images may usually take some time (also depends on its size) before it is fully loaded on the page. That's pretty normal since the HTML loads first before the script hides the relevant elements. Rendering time for images and long forms may take a few seconds. Many factors may also matter like the internet speed and the browser performance. 

    Thanks.

  • centerweb
    Replied on November 27, 2014 at 6:25 PM

    Hi, I believe the problem is the images needing to load before the script is run, which looks very amateurish in my eyes when it comes to presentation.  I tried a solution to hide the images before loading and then hoping the script would show the images when I clicked the proper conditional.  This worked in keeping the image hidding on load, but the javascript would not override the "hidden" css I added, is there a similar approach to this but smart enough to work?  Thanks.

  • Ashwin JotForm Support
    Replied on November 27, 2014 at 11:03 PM

    Hello centerweb,

    This worked in keeping the image hidding on load, but the javascript would not override the "hidden" css I added, is there a similar approach to this but smart enough to work? 

    I am not sure if I have understood this part of your question. I did check your form "CartoonYourself.me - Order Form" and it seems to work as expected. You have added the condition to show / hide the images which works perfectly. 

    I would suggest you to remove the default selection of your question "Image Selection" and this will not try to display the image as soon as the page/form is loaded. Please check the screenshot below : 

    Conditional hidden images quickly shows during the initial load of the form Image 1 Screenshot 20

    Hope this helps.

    Do get back to us if you meant to ask something else.

    Thank you!