Supprimer les atsortingbuts CSS «top» et «left» avec jQuery

Je construis une carte déplaçable à laquelle, lorsque la carte est déplacée, l’élément reçoit un atsortingbut «gauche» et «haut» avec des valeurs pour chacun d’eux.

Map

J’ai un bouton que je veux supprimer les atsortingbuts top et left du style en ligne sur le div quand on clique dessus. Est-ce possible avec jquery?

Les valeurs par défaut pour CSS top et left sont auto . Par conséquent, leur atsortingbution peut être équivalente en fonction de ce que vous essayez de faire:

 $('.map').css('top', 'auto').css('left', 'auto'); 

Vous avez également la possibilité de supprimer complètement l’atsortingbut de style :

 $('.map').removeAttr('style'); 

Toutefois, si vous utilisez d’autres composants de l’interface utilisateur jQuery, ceux-ci peuvent nécessiter des styles en ligne que vous ne souhaitez pas supprimer. Vous devez donc procéder avec prudence.

Si vous souhaitez supprimer spécifiquement les atsortingbuts top et left et en laisser d’autres, vous pouvez le faire:

 $('.map').css('top', '').css('left', ''); 

Ou un équivalent plus court:

 $('.map').css({ 'top': '', 'left': '' }); 

Vous pouvez supprimer tout le contenu de l’atsortingbut de style en procédant comme suit:

 $('.map').removeAttr('style'); 

Et vous pouvez supprimer des style spécifiques en faisant:

 $('.map').css('top', ''); $('.map').css('left', ''); 

Il suffit de définir la propriété CSS avec une chaîne vide, par exemple avec le code suivant:

 $('#mydiv').css('color', ''); 

Voir la documentation jQuery sur CSS .

  1. Allez ici: API jQuery
  2. Ctrl + F pour ‘supprimer’
  3. Lis:

Définir la valeur d’une propriété de style sur une chaîne vide – par exemple $ (“#mydiv”) .css (“color”, “”) – supprime cette propriété d’un élément s’il a déjà été appliqué directement, que ce soit dans le style HTML atsortingbut, par le biais de la méthode .css () de jQuery ou par la manipulation directe de la propriété de style dans le DOM.

Les documents vous donnent l’approche actuelle recommandée pour ce que vous essayez d’accomplir, ce qui peut souvent vous faire gagner du temps, car vous n’avez pas à lire et revenir sur les guerres de flammes (peu importe le plaisir ou l’illumination). !).

Par ce rapport de bogue JQuery

  element.removeAttr ('style') 

ne fonctionne pas de manière cohérente dans les navigateurs Webkit. Par exemple, j’ai rencontré ce problème sur iOS 6.1. Le correctif est d’utiliser:

  element.attr ('style', '') 

Si vous voulez supprimer tout cela, vous pouvez le faire

 $('.map').removeAttr('style'); 
 $.fn.removeCss=function(prop){ if(!prop){ return $(this).removeAttr('style').removeAttr('class'); } else{ return $(this).css(prop,null); } } 

alors si vous voulez enlever les accessoires css:

  $('#mydiv').removeCss('color'); //To remove all prop Css $('#mydiv').removeCss(); 

À mon avis, la méthode la plus propre consiste à supprimer complètement la propriété CSSStyleDeclaration de l’élément, au lieu de la remplacer par une sorte de valeur null / zero / default:

 $(".foo").prop("style").removeProperty("top"); $(".foo").prop("style").removeProperty("left"); $(".foo").prop("style").removeProperty("background-color"); 
 $.fn.removeCss=function(toDelete){ var props=$(this).attr('style').split(';'); var tmp=-1; for( var p=0;p 

Supprimer en toute sécurité avec ce plugin!

$ ('myDiv'). removeCss ('color');

Certains styles ne peuvent pas être facilement supprimés.

Une solution consiste à créer 2 classes différentes et à append / supprimer celle contenant le style souhaité.

PAS la meilleure solution pour les propriétés de style qui peuvent être facilement supprimées / désactivées.

  $("#map").css("top", "0"); $("#map").css("left", "0"); 

Pour supprimer les styles css, assignez une chaîne vide au style

dans ce cas

 $('.map').css({top:'',left:''});