App Connect Background Video Support Product Page

Solved

adding video breaks site css

Reported 10 Jun 2019 10:01:37
1
has this problem
10 Jun 2019 10:01:37 Jamie F posted:
Hi

Have just puchased the background video app and am trying to add a video to a page.

Without the video, the test page looks like this clients.motley.site/puregreen/test/template.html and the intention is to add the video to the container with class="row headerLayer"

When I do that, the page looks like this clients.motley.site/puregreen/test/template2.html

Your advice how to get the video to display within that container without it breaking the rest of the css would be appreciated.

Am running DW 2015.3 7888 on Windows 10

Thanks

Jamie

Replies

Replied 10 Jun 2019 11:58:35
10 Jun 2019 11:58:35 Teodor Kuduschiev replied:
Hello,
How exactly did you add the video there? Can you explain step by step please?
Replied 10 Jun 2019 12:28:27
10 Jun 2019 12:28:27 Jamie F replied:
sure, have done a screen capture video of it - which can be downloaded here www.motley.site/misc/ice_video_20190610-131715.zip

the page that was 'created' in the video is this one: clients.motley.site/puregreen/test/template3.html
Replied 10 Jun 2019 12:35:57
10 Jun 2019 12:35:57 Teodor Kuduschiev replied:
It's because of your page structure.
Please move the video player tags inside the row ...

<div id="bgvideo1" is="dmx-background-video" src="images/misc/26859013-preview.mp4">

Replied 10 Jun 2019 12:41:05
10 Jun 2019 12:41:05 Jamie F replied:
sorry, which tags do you mean?
Replied 10 Jun 2019 12:46:52
10 Jun 2019 12:46:52 Teodor Kuduschiev replied:
Put the video player div inside this ROW you are trying to put the video into. I pasted which tag in my last post.
Replied 10 Jun 2019 13:08:56
10 Jun 2019 13:08:56 Jamie F replied:
i had tried that already but have done it again so you can see clients.motley.site/puregreen/test/template3.html

it just breaks the css in a different way.

I noticed that if I removed 'overflow:hidden' (from
<div style="position: absolute; width: 100%; height: 100%;  overflow: hidden; ">

) in webmaster tools, then the video becomes visible but then other css becomes broken.
Replied 10 Jun 2019 13:24:01
10 Jun 2019 13:24:01 Teodor Kuduschiev replied:
There is something strange in your page layout/css which is causing this.
Please remove the video player tags from your page and add the video attributes to your row headerLayer to test if it works fine:


<div class="row headerLayer" id="bgvideo1" is="dmx-background-video" src="images/misc/26859013-preview.mp4">


Replied 10 Jun 2019 13:32:36
10 Jun 2019 13:32:36 Jamie F replied:
ok thats worked...many thanks
Replied 28 Aug 2023 13:52:14
28 Aug 2023 13:52:14 User  replied:
Hello. Crftvideo is an absolute game changer when it comes to creating amazing videos that can drive sales and turn your leads into paying customers (crftvideo.com/). With a wide range of video types, they cater to all your unique needs and goals.
Replied 01 Mar 2024 06:33:14
01 Mar 2024 06:33:14 timmy 7 replied:
I'm especially curious in learning more about video marketing so that I may properly promote my business and products. I've heard a lot about how effective video content can be in reaching and engaging potential consumers, but I'm not sure where to begin or what tactics would work best for my business and target audience. Furthermore, I'd want to learn more about the numerous types of video content that are most effective for businesses, how to develop high-quality films on a tight budget, and how to distribute and promote them across several platforms to optimize their impact.
This reply was removed on 3/4/2024 6:34:55 AM.
See the changelog
Replied 29 Mar 2024 20:47:23
29 Mar 2024 20:47:23 imma watson replied:
Hi there,

I see the issue you're encountering with adding the video to your page. It seems like the CSS layout is being disrupted when the video is introduced to the container with the class "row headerLayer".

One potential solution you could try is adjusting the CSS properties for the video container to ensure it integrates seamlessly with the existing layout. This might involve tweaking the positioning, size, or display properties of the container and the video itself.

Another approach could be using a video editing tool like CapCut MOD APK to customize the video to better fit the container dimensions or aspect ratio. CapCut offers various editing features that might help optimize the video for your webpage layout.

In any case, it's essential to ensure that the video's dimensions and styling align properly with the surrounding elements on the page to avoid disrupting the layout.

If you need further assistance or clarification on implementing these solutions, feel free to ask!

Best regards, imma watson

Replied 08 May 2024 08:40:25
08 May 2024 08:40:25 Abbas Khan replied:
Blooket Joins an amazing platform that provides learning experiences to students of all types. This platform is mainly for those students who can not study with full concentration in the classroom. In this section, we will discuss the “Blooket Hack Join”. This is a collection of different strategies, some amazing features, and an application that can provide the full power of education without any problem.
Replied 21 May 2024 21:31:23
21 May 2024 21:31:23 Abbas Khan replied:
I was surfing on the internet and I found a post about AJ Hawk net worth. I read it and I like ti very much. I think you need to read about her and then you will know that he is a great celebrity.
Replied 04 Jun 2024 07:40:59
04 Jun 2024 07:40:59 Larry McConnell replied:
Most background video apps provide an embed code snippet. Look for that in the app's settings and copy it. In your HTML code, locate the container with the class "row headerLayer" and paste the embed code within the opening and closing tags of that container. This should embed the video within the designated area.

If the video messes up your CSS layout, it might be due to the video's size or aspect ratio. Play around with the video's properties within the app (if it allows) or use CSS to adjust its width, height, and positioning within the container.

Also you can use Instander apk to upload your video to their platform and then embed it on your website to avoid any disruption or CSS breaking.

I hope this will help you in resolving your issue
Replied 10 Jun 2024 16:58:41
10 Jun 2024 16:58:41 Allan Vincent replied:
Hi there,

I'm really sorry to hear you're having trouble with integrating the background video into your page. It can be frustrating when something isn't working as expected, especially when you're looking forward to enhancing your site. The issue you're encountering seems to be related to how the video is being embedded within the container and possibly conflicting with the existing CSS. I'd recommend checking the CSS properties of the container with class="row headerLayer" and ensuring there are no conflicting styles that might be affecting the video display. Sometimes, setting the video element's CSS to fit the container properly, like using position: absolute; top: 0; left: 0; width: 100%; height: 100%; might help in maintaining the layout without breaking it.

I can totally relate to your frustration as we faced a similar issue with embedding a 10th class result checking feature on a client's site. The solution was to carefully review the CSS and HTML to ensure there were no conflicts and everything was nested correctly. I hope this helps you get the video working seamlessly within your container. If you need further assistance, feel free to reach out, and we'll figure it out together.

Hang in there, you're doing great.
Replied 27 Jun 2024 06:53:51
27 Jun 2024 06:53:51 UFilling Login replied:
With the UIF’s online portal, you can quickly determine whether you’re eligible for benefits or not. In this guide, we’ll walk you through the steps to check your UIF status and balance online.
Replied 27 Jun 2024 10:25:32
27 Jun 2024 10:25:32 User  replied:
Honista Mod Android Clue latest version APK download for Android. it's just a simple honista 9.1 app thats shows you how to do it over and over.
Replied 27 Jun 2024 10:32:54
27 Jun 2024 10:32:54 UFilling Login replied:
UIF Online is the intranet site for the University of Illinois advancement community. This site has been developed to be a one-stop-shop for resources for University of Illinois advancement professionals. UIF Online contains information on a broad spectrum of topics including news, announcements, gift planning resources, accounting information, gift forms, policies and procedures, calendars, social media feeds, a resource library, UIF HR information, and much more. It also includes links to important tools such as TED, iLearn, and others that are critical to your daily work. This site will be updated regularly so please visit often to stay current on the latest advancement resources.
Replied 27 Jun 2024 10:34:04
27 Jun 2024 10:34:04 Talha Rehmaan replied:
It sounds like adding the video is causing some issues with your site's CSS. This can happen due to conflicts between the video player's styles and your existing CSS rules. To troubleshoot, try isolating the problem by checking the specific CSS classes or IDs used by the video player. Adjusting or overriding these styles might help resolve the issue. On a different note, taking a break to enjoy some beach buggy racing unlock all cars can be a fun distraction while you brainstorm a solution. If you need further assistance, feel free to share more details about the problem!
Replied 18 Jul 2024 10:38:16
18 Jul 2024 10:38:16 Talha Rehmaan replied:
Exciting news about App Connect Background Video Support! This feature enhances user experience by adding dynamic visuals to apps. It's a game-changer, especially for developers aiming to create immersive environments. Looking forward to exploring its potential. Also, check out our latest updates on asphalt nitro hack unlimited money and tokens for even more app enhancement possibilities!
Replied 23 Jul 2024 11:21:55
23 Jul 2024 11:21:55 User  replied:
Bendigo Banking keenly monitors your account balances and reports as often as you demand anytime, anywhere. Moreover, it covers the process of transactions viewing your thorough finance history and then reports to you in the form of e-statements.
Replied 29 Jul 2024 10:38:04
29 Jul 2024 10:38:04 Nadir Bhola replied:
I dont get what exactly need help with,it just shows it ,I wanted to help you as I did to slot gacor hari ini but your site does not have a Ui.
Replied 07 Aug 2024 03:23:15
07 Aug 2024 03:23:15 iamjamshed 11 replied:
Users can download reels, IGTV, videos, and high-quality photographs with the instander apk download InstaMode. Additionally, it facilitates the testing of premium features like No Ads, Copy The biography, Copy Remarks, Copy Description, and More. instanderapk.pro/
Replied 20 Aug 2024 22:02:59
20 Aug 2024 22:02:59 Local seo replied:
Great ful post cute bio for instagram

Reply to this topic