my snippet above should work.

but on reading the magnific popup docu – a better idea comes to my thoughts:

we can try on Ismaels inline popup code the before and after function – remove all done so far except the snippet from Ismael https://kriesi.at/support/topic/lightbox-17/#post-1270093
and add some callbacks:

jQuery('.open-popup-link').magnificPopup({
	type:'inline',
	midClick: true,
	callbacks: {
		beforeOpen: function () {
			jQuery('html').css("overflow-y", "hidden");
		},
		close: function() {
			jQuery('html').css("overflow-y", "auto");
		},
	},
});

PS to Ismael: the overflowY parameter for magnific popup only rules the sidebars in the popup itself ! Link
“Defines scrollbar of the popup… ”
______________

PPS: again

and if i look to that DOM – and the events on that inline links – i never had so much jQuery on those inline-popups

maybe there are different events on that click too !
this is the amount of jQuery on my inline popups:

• This reply was modified 4 years, 6 months ago by Guenni007.

and by the way : https://webers-testseite.de/multiple-background-images/

no – i think they have to look how the filter is working in a proper way. I prefer a child-theme solution too.

________
you see the lines in the php code from my post
there is: 'default_jpeg_quality' => 100,
on both files change it to f.e. 55

______

PS : btw. I have already mentioned it on other occasions
it would be nice if filters are added or replaced/renamed we could read a tutorial e.g. in github.

• This reply was modified 4 years, 6 months ago by Guenni007.

The benefit of those image formats is the aspect ratio – f.e. in banners on top.
The big disadvantage is ( if the snippets of compression do not work in a satisfying manner ) that the original upload image is much smaller in file-size than nearly all of the generated formats (except those images less than 120px).
The services such as gtmetrix will not be happy about the scaling ( when using the original upload image ) and will criticize this; however, the loading times of the images will be lower.
?

these two columns ( i took 2/3 and 1/3 – but the width is set on the css code) – with individual height are together in a color-section with that trigger class: overlapping-columns – thats all.
The top shift of the right column must be found as margin-bottom on that column.
The left shift ( overlapping ) is added to the width of the right column – so that the whole width will fill the setted content width.
As you can see – you can use all those animations Enfold ALB is given for those columns.

Edit : see example page again : this is a single Icongrid element in a column. ( a shadow is a bit tricky there – because a shadow on the column will be not nice )

please tell us why : is it solved – and how did you solve it?

the scroll to top i only know if you did that on magnific parameters: https://dimsemenov.com/plugins/magnific-popup/documentation.html#aligntop

and if i look to that DOM – and the events on that inline links – i never had so much jQuery on those inline-popups :

• This reply was modified 4 years, 6 months ago by Guenni007.

because of the browser policy

It’s not because of Enfold or because of WordPress.
The browser specs do not allow autoplay without the user’s consent if the video has sound enabled.

These settings can not be influenced by the theme – if you set the policy by yourself in the browser ( that could be done separately for different pages ) to trust that site the themes autoplay could be done.

f.e. firefox:
(click to enlarge) – each bowser got his own way to make these settings.

A lot of users have allready good image editors to optimize the jpgs for web with the wanted and for each image best compression rate.
Many images are not critical and therefore tolerate higher compression rates.
On uploading images – enfold genereates the calculated formats from the opend jpg and does not set a compression rate. So it is like you save a jpg with zero compression ( in photoshop f.e. quality 12 : maximum )

the original code you can find in functions.php was since line 236:

so you can influence that on setting a compression rate in your child-theme functions.php
( here in my example 65% – but in most cases a 45% will be ok too )

 function av_return_100(){ return 65; }
  add_filter('jpeg_quality', 'av_return_100');
  add_filter('wp_editor_set_quality', 'av_return_100');

Then
Whether a format provided by Enfold ( functions.php lines 178ff ) is generated can be influenced again by means of a snippet in the child-theme functions.php:

Some formats are needed by Enfold because they are used in the backend. The formats you want to keep then comment out analogous to the widget format.

// Disable loads of Enfold & WP image sizes upon upload
add_action('init', 'remove_enfold_image_sizes');
function remove_enfold_image_sizes() {
// do NOT remove widget size, is used in backend portfolio items!
// remove_image_size('widget');
  remove_image_size('square');
  remove_image_size('featured');
  remove_image_size('featured_large');
  remove_image_size('portfolio');
  remove_image_size('portfolio_small');
  remove_image_size('gallery');
  remove_image_size('magazine');
  remove_image_size('masonry');
  remove_image_size('entry_without_sidebar');
  remove_image_size('entry_with_sidebar');
  remove_image_size('shop_thumbnail');
  remove_image_size('shop_catalog');
  remove_image_size('shop_single'); 
  remove_image_size('shop_gallery_thumbnail');
}

and if you like to do that with WP image formats too:

// Remove unneeded WP image sizes
add_filter( 'intermediate_image_sizes_advanced', 'prefix_remove_default_images' );
// Remove default image sizes here. 
function prefix_remove_default_images( $sizes ) {
// do NOT remove small and medium sizes, they are used in backend Media Library!
// unset( $sizes['small']); // 150px
// unset( $sizes['medium']); // 300px
 unset( $sizes['large']); // 1024px
 unset( $sizes['medium_large']); // 768px
 return $sizes;
}

BUT:
However, if you add this to an existing installation, you would have to recalculate your thumbnails afterwards.
There are small plugins that you can use temporarily for this action. Whereby you should make sure that the omitted formats are also deleted then.

in former times i used this : Force Regenerate Thumbnails
does that on recalculating.

But maybe a newer Plugin will be better – this seems to be from an image expert and will do the job too: reGenerate Thumbnails Advanced

what is your code you inserted to copy right input filed?

Did you pay attention of the jQuery Migrate Plugin settings: load 1.12.4 legacy jQuery

but you can do something that will not disturb those menu-item-ids.
You can give an Id and Alt attribute to the anchor itself.

But i had to find a way that we will not have duplicate ids then – you see the problem if you put this to your child-theme functions.php

the (hamburger menu items anchors will have the same ids – and if the menu-link goes in a one-pager to that ID – . . . . .… etc. pp.
maybe it is on SEO Purpose more important to have only the alt Attribute to that link!!!:
Why must it be an ID that was tracked by Google Analytics? Arn’t there other possibilities.

function set_attributes_to_menu_links(){
?>
<script>
(function($){
  $(document).ready(function(){  
    $('#avia-menu .menu-item a').each(function(){
      var menuName = $(this).find('>.avia-menu-text').text();
      var customID = menuName.replace(/\s+/g, '_').toLowerCase();
      $(this).attr('alt', menuName); 
      $(this).attr('id', customID);    
    });
  });
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'set_attributes_to_menu_links');

just look to a enfold layout with developer tools of your browser- you can use that html as well:

<div class="flex_column av_one_half first">
	<label>[text* your-name  placeholder "Your first and last name * "] </label> 
</div>
<div class="flex_column av_one_half">
	<label> [email* your-email placeholder "your E-mail address *"] </label>
</div>

<div class="flex_column av_one_full"> <label>[text* your-subject  placeholder "Your Subject *"] </label> </div>

Here on that example it is with placeholder text for the input fields. But this is not necessary.
Just place the given content of contact form 7 inbetween these divs

maybe you style your layout on a post first with only columns in advanced layout builder and look to this post on your browser with dev tools
f.e. this is the needed code for 1/3 – 2/3

<div class="flex_column av_one_third first">
   content from contact form 7
</div>
<div class="flex_column av_two_third">
     content from contact form 7
</div>

and you are shure that you are not affected by this: https://kriesi.at/support/topic/problems-after-updating-to-wordpress-5-6-read-this-first/