Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    Loading gif for html5 videos

    Feedback
    2
    2
    32
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • ?
      A Former User last edited by

      Hey team,

      Just wondering if there's a way to use a looping gif as a loading icon for html5 videos? I'm using a very low res video for my reel atm, and I'd like to go bigger with a short loading animation to let folks know something tasting is loading.

      A great example of something I'm thinking is here - https://altcinc.com/

      Many Thanks & love your work!

      1 Reply Last reply Reply Quote 0
      • Richard
        Richard Global Moderator last edited by

        Dear @strayorbit

        Unfortunately this is not possible from the standard options provided,
        However if you have have a basic understanding of HTML, CSS & JS you can fairly easily implement this onto your page through the "+ More - HTML" option within the Gridder -

        Screen Shot 2020-09-14 at 2.50.29 PM.png

        Alternatively you can use "Custom CSS & HTML" in "Lay Options"

        Screen Shot 2020-09-14 at 2.51.54 PM.png

        Adding a Video through Custom Code:
        https://www.w3schools.com/html/html5_video.asp

        With this option you have much more flexibility over how you control the video along with options to add a loading Gif:

        https://stackoverflow.com/questions/8230748/how-to-add-loader-image-to-html5-video

        For more information regarding CSS:

        https://laytheme.com/documentation.html#custom-css-styling
        Additionally when using Javascript we need to remember to load it into Lay Theme with a "Newpage Event" :

        https://laytheme.com/documentation.html#custom-javascript

        Also if using jQuery, to replace the shorthand symbol '$' to 'jQuery'

        If this becomes too problematic you may wish to seek the aid of a developer.

        I once again apologise that the option isn't as easy and that i cannot help further with Customisation,
        however if you have any further questions please feel free to ask :)

        Best Wishes and thank you for using Lay Theme

        Sincerely
        Richard

        1 Reply Last reply Reply Quote 0
        • First post
          Last post

        Try this to fix issues before you post:

        Use the Search Feature. Maybe there is already a solution to your issue.

        1. Update Lay Theme and all Lay Theme Addons
        2. Disable all Plugins
        3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
        4. Now see if your problem solved itself
        5. Go here, see if your problem is listed here:
        Troubleshooting

        When you post:
        1. Post a link to where the problem is
        2. If the problem is difficult to explain, post screenshots / link to a video to explain it

        Thanks!

        Online Users

        S
        K
        T
        G
        I
        A

        Recent Topics

        • S

          Image hover -> Image on image

        • C

          centred Carousel fixed width and proportions

        • text underline

        • open all links in a thumbnail grid in a new tab

        laytheme.com