Wordpress Plugin with Responsive HTML5

Responsive Flexible Layouts
1

I’m currently using the Wordpress plugin to embed an HTML5 animation.

I am embedding it using a div, not an iframe and I included CSS via the plugin to set the height to 400px.

However, it seems like there is a still a size issue.

The original HTML5 is located here, for reference: http://pluckvermont.com/dev/UMALL%20HTML5%203%20Responsive.html

When I look at the embed, I do see a scaleX, scaleY being applied (see screenshot here). Are there other issues causing this size issue?

Many thx–

2

Can you clarify what you’re expecting to see and what is being shown? I’m not sure I immediately can tell what the problem is.

It might also be useful to include a zip of your .hype document and link to the blog where it is (or would be) posted on.

3

Including via DIV doesn’t include HeadHTML so you need to assign an class under Hype animation and define your CSS in the customizer or in your child theme CSS file.

4

Another option is to set the height from within the Hype document. You would set the height in the scene load. Currently document load isn’t available from within the Hype GUI. There is also an extension to set height in the extension section.

5

Thanks for all your input–I did find the solution. There seemed to be a sizing issue with the HTML5 animation as a whole until I added a white rectangle within the HTML5 animation.

My original size in Hype was 1920x1080, but various CSS styles were shifting the overall size on the animation within my Wordpress page. Placing a white rectangle at 1920x1080 seemed to retain the shape during responsive behaviors.

Here is a screenshot of it corrected.

1 Like