Discussion :

[Vinzzzzzz]

Bonjour à tous,

Je souhaiterais pouvoir supprimer un element HTML en temps réel selon le changement de résolution (comme avec les media queries en css).
Je m'explique, j'ai un element <map> que j'utilise pour les résolution de type grandes et moyennes. Mais pour les ecrans avec une max-width de 736px, je souhaite supprimer totalement cet élément. Car en css le display:none et le visibility:hidden ne fonctionnent pas. J'ai réélement besoin que le map disparaissent du code source. J'utilise donc la fonction remove() proposée par jquery. Mais voilà, si je change la taille de ma fenêtre, il me faut faire un refresh pour que cela fonctionne... Y a t'il un moyen de solutionner ce problème ?

Mon code pour le moment :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
if($(window).width() >= 736){
 
		//MAP ANIMATION
		$('.cutview').maphilight();
 
		$('map area').click(function(e) {
			e.preventDefault();
			var clickedArea = $(this); // remember clicked area
 
			// foreach area
			$('map area').each(function() {
				hData = $(this).data('maphilight') || {}; // get
				hData.alwaysOn = $(this).is(clickedArea); // modify
				$(this).data('maphilight', hData ).trigger('alwaysOn.maphilight'); // set
			});
		});
	}
	else
	{
		$( "#cutview" ).remove();
	}

Un grand merci !

[Watilin]

Bien sûr ! Il te suffit de surveiller l'évènement resize. Jette un œil à la doc : .resize()