Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Autoplay Video Code Block size on desktop vs mobile


Question

Site URL: https://tambourine-apple-mx9f.squarespace.com/semc

Hello! I've followed various bits of advice on here and got a video to auto play on a one of my site pages but in order for it to display properly on the desktop page I changed the width and height to values that are appropriate. This means that it displays absolutely huge on mobile and hangs off the edge of the screen. 

Is there some code I can use to adjust this and how can I stop this happening on other similar videos on other pages, when I upload them?

Similarly I wanted to add a secondary logo in my footer which again displays huge on mobile. Is there a way to adjust this for mobile as the spacer modules don't display. 

Thanks in advance!

Link to comment
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Posted Images

3 answers to this question

Recommended Posts

  • 0
13 hours ago, benji_roebuck said:

Site URL: https://tambourine-apple-mx9f.squarespace.com/semc

Hello! I've followed various bits of advice on here and got a video to auto play on a one of my site pages but in order for it to display properly on the desktop page I changed the width and height to values that are appropriate. This means that it displays absolutely huge on mobile and hangs off the edge of the screen. 

Is there some code I can use to adjust this and how can I stop this happening on other similar videos on other pages, when I upload them?

Similarly I wanted to add a secondary logo in my footer which again displays huge on mobile. Is there a way to adjust this for mobile as the spacer modules don't display. 

Thanks in advance!

Q1. Hi where is video?

Q2. You can add logo, then we will give the code to make it small on mobile only

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

Hey @tuanphan! The video should autoplay but there's screenshots attached of the issues - the video is the second image down and you can see how it hangs off the edge of the screen in mobile view.

The logo is the one I've added in the bottom nav – screenshots also attached of how it displays on desktop vs mobile. Any help much appreciated!

 

Screenshot 2021-07-23 at 09.22.09.png

Screenshot 2021-07-23 at 09.21.52.png

Screenshot 2021-07-23 at 09.22.01.png

Screenshot 2021-07-23 at 09.22.13.png

Link to comment
  • 0
On 7/23/2021 at 3:39 PM, benji_roebuck said:

Hey @tuanphan! The video should autoplay but there's screenshots attached of the issues - the video is the second image down and you can see how it hangs off the edge of the screen in mobile view.

The logo is the one I've added in the bottom nav – screenshots also attached of how it displays on desktop vs mobile. Any help much appreciated!

 

Screenshot 2021-07-23 at 09.22.09.png

Screenshot 2021-07-23 at 09.21.52.png

Screenshot 2021-07-23 at 09.22.01.png

Screenshot 2021-07-23 at 09.22.13.png

Add to Design > Custom CSS

/* mobile Semc page */
@media screen and (max-width:767px) {
/* resize video */
div#block-yui_3_17_2_1_1626960429075_6605 iframe {
    width: 100% !important;
    height: 200px;
}
/* resize footer logo */
div#block-yui_3_17_2_1_1616522110650_7328 {
    width: 30%;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...