Couple of problems with 3.1 update.

Hey christopherheath!

Thank you for using Enfold.

1.) Since you’re using large background images, I think we’ll both agree that they won’t fit on mobile device or will not look exactly the same as they do in desktop view. What you can do is to adjust the image focus, on the eagle for example, you can focus on the head or eyes. Edit the color sections then add a unique ID attribute to the Section ID field. Let’s start with the eagle section, use “eagle-section” for example. Adjust the background position using this on Quick CSS field:

@media only screen and (max-width: 767px) {
#eagle-section .av_parallax {
background-position: 30% 50% !important;
}}

Use different css media queries for different screen sizes.

2.) You have to double tap the buttons on mobile devices because they have a hover state. If you don’t want that behaviour, toggle the Icon Visibility.

Best regards,
Ismael

Hi!

Alright. I didn’t notice the background colour right away. Add this to the functions.php file:

add_action('wp_footer', 'ava_auto_resize');
function ava_auto_resize(){
?>
<script>
(function($){	
	$(window).on("resize", function (event) {
		if (event.originalEvent === undefined) {
			var alien = 'alien';
			console.log(alien);
		} else {
			var human = 'human';
			console.log(human);
		}
	}).resize();
})(jQuery);
</script>
<?php
}

Remove browser cache then reload the page. You can try the suggestion above to adjust the background position.

Regards,
Ismael

Hey!

Glad we could help. :)

Best regards,
Ismael