Modernizr probleem, functie wordt uitgevoerd op alle browsers

Door Snelle Jaap op 19-01-2018 12:52

1.822 views

Hallo,

Zijn er hier mensen die ervaring hebben met modernizr?

Ik heb een fallback moeten maken zodat object-fit ook werkt (maar dan op een andere manier) op IE. Het probleem is alleen dat hij deze functie op alle browsers toepast, dus ook op browsers die wel gewoon netjes object-fit ondersteunen.

Wat doe ik verkeerd?

Mijn code:


if ( ! Modernizr.objectfit ) {
	console.log('object fit wordt niet gesupport');
	tpj('.featuredpost').each(function () {
		var $container = tpj(this),
				imgUrl = $container.find('.img-responsive').prop('src');
		if (imgUrl) {
			$container
				.css('backgroundImage', 'url(' + imgUrl + ')')
				.addClass('compat-object-fit');
		}
	});

	tpj('.big-post').each(function () {
		var $container = tpj(this),
				imgUrl = $container.find('.img-responsive').prop('src');
		if (imgUrl) {
			$container
				.css('backgroundImage', 'url(' + imgUrl + ')')
				.addClass('compat-object-fit');
		}
	});
}else{
	console.log('object fit wordt gesupport');
}

Op alle browsers lees ik nu in de console: 'object fit wordt niet gesupport'. Terwijl dat alleen waar is voor IE.

Jan Koehoorn

22-01-2018 16:19

Misschien als alternatieve check met testAllProps:


<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>

    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.js"></script>
    <script type="text/javascript">
        console.log(Modernizr.testAllProps('objectFit','cover'));
    </script>
</body>
</html>

Reageren

Inloggen om te reageren