jQuery로 CSS "top"및 "left"속성 제거

jQuery로 CSS "top"및 "left"속성 제거

---

지도를 드래그 할 때 요소에 각각의 값이있는 'left'및 'top'속성이 부여되는 드래그 가능한 맵을 작성합니다.

<div class="map" style="top:200px; left:100px;">Map</div>

클릭하면 div의 인라인 스타일에서 상단 및 왼쪽 속성을 제거하려는 버튼이 있습니다. 이는 jquery로 가능합니까?

---

CSS top및 의 기본값 left은입니다 auto. 따라서이를 설정하는 것은 수행하려는 작업에 따라 동일 할 수 있습니다.

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

style속성 을 완전히 제거하는 옵션도 있습니다 .

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

그러나 다른 jQuery UI 구성 요소를 사용하는 경우 제거하지 않으려는 인라인 스타일이 필요할 수 있으므로주의해서 진행하십시오.

---

상단 및 왼쪽 속성을 구체적으로 제거하고 다른 속성을 남기려면 다음과 같이하십시오.

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

또는 더 짧은 것 :

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

---

다음 style을 수행 하여 속성 의 모든 내용을 제거 할 수 있습니다 .

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

다음 style을 수행하여 특정을 제거 할 수 있습니다 .

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

---

CSS 속성을 빈 문자열로 설정하면됩니다 (예 : 다음 코드 사용).

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

CSS의 jQuery 설명서를 참조하십시오 .

---

1. 여기로 이동 : jQuery API
2. '제거'에 대한 Ctrl + F
3. 읽다:

스타일 속성 값을 빈 문자열로 설정하면 (예 : $ ( "#mydiv") .css ( "color", "")) HTML 스타일에 관계없이 해당 속성이 요소에 이미 적용된 경우 해당 속성을 제거합니다. 속성, jQuery의 .css () 메소드 또는 스타일 속성의 직접적인 DOM 조작을 통해.

이 문서는 달성하려는 목표에 대한 현재 권장되는 접근 방식을 제공합니다. 스택 오버플로에서 화염 전쟁을 앞뒤로 읽을 필요가 없기 때문에 시간을 절약 할 수 있습니다. !).

---

당 이 JQuery와 버그 리포트

element.removeAttr ( 'style')

웹킷 기반 브라우저에서 일관되게 작동하지 않습니다. 예를 들어, iOS 6.1에서이 문제를 겪었습니다. 수정은 다음을 사용하는 것입니다.

element.attr ( 'style', '')

---

모든 것을 제거하려면 할 수 있습니다

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

---

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

}

그런 다음 CSS 소품을 제거하려면 :

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

---

내 생각에 가장 깨끗한 방법은 속성 을 null / zero / default 값으로 덮어 쓰지 않고 요소의 CSSStyleDeclaration 에서 속성을 완전히 제거하는 것입니다.

$(".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<props.length; p++){if(props[p].indexOf(toDelete)!==-1){tmp=p}};
if(tmp!==-1){

   delete props[tmp];
}

  return $(this).attr('style',props.join(';')+';');

}

이 플러그인으로 안전하게 삭제하십시오!

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

---

There are some styles that can't be easily remove.(overflow comes to mind)

A workaround would be to create 2 different classes and add/remove the one containing the style you want.

NOT the best solution for style properties that can be easily remove/disabled.

---

To remove css styles assign an empty string to the style

in this case

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

---

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

참고URL : https://stackoverflow.com/questions/9398870/remove-css-top-and-left-attributes-with-jquery