2012-06-21 2 views
0

그래서 저는 망막 그래픽을 적용하기 위해 jQuery 플러그인을 작성하고 있습니다. 요소 (배경 이미지 또는 소스 이미지가있는 경우)를 선택한 다음 내부에있는 모든 요소 (배경 이미지 또는 소스 이미지가있는 경우)를 선택해야합니다. 그들은 CSS background-image 속성이 경우 배경 이미지가있는 경우 신체 요소를 반환해야이미지가있는 부모 내의 모든 요소를 ​​선택하십시오.

//RetinizeJS 
(function($){ 
    $.fn.retinize = function(){ 
    $(this).filter(function(){ 
     if (this.currentStyle) 
      return this.currentStyle['backgroundImage'] !== 'none'; 
     else if (window.getComputedStyle) 
      return document.defaultView.getComputedStyle(this,null) 
       .getPropertyValue('background-image') !== 'none'; 
    }).addClass('bg_found'); 
    }; 
})(jQuery); 

$('body').retinize(); 

, 그들이 <img src="" /> 경우 내의 모든 요소 나 :

여기 내 플러그인입니다.

어떻게하면됩니까?

UPDATE 오후 9시 13분 :

이 아무것도에 클래스 HAS_IMAGE를 추가하지 않고, 내가 || ($this.css('backgroundImage') !== 'none');를 제거하는 경우가 여전히 <img> 요소를 선택하지 않습니다.

//RetinizeJS 
    (function($){ 
     $.fn.retinize = function(){ 
      $this = $(this); 
      $this.find('*').andSelf().filter(function(){ 
       return $this.is('img') || ($this.css('backgroundImage') !== 'none'); 
     }).addClass('HAS_IMAGE'); 
    }; 
    })(jQuery); 

    $('body').retinize() 
+0

내 음모 이론가는 지난 며칠 동안 다운볼트 로봇이 있다고 의심하기 시작했습니다. 나는 이것이 왜 득표되지 않았는지 알지 못한다. –

+0

누가 그것을 downvoted? 그것은 downvotes가 없습니다. – alt

+0

아, 한참 전이었습니다. –

답변

1

.css()을 사용하여 요소에 특정 CSS 규칙 값이 있는지 확인할 수 있습니다. .css('backgroundImage')을 확인하여 CSS background 또는 CSS background-image을 사용하여 요소가 설정되었는지 여부에 관계없이 요소에 배경 이미지가 있는지 확인할 수 있어야합니다 (즉, 테스트하지 않은 것).

당신은 너무 같은 필터 기능을 설정하는 그 지식을 사용할 수 있습니다 : 당신은 그냥 작업을해야합니다

$(selector).filter(function() { 
    var _this = $(this); 
    return _this.is('img') || (_this.css('backgroundImage') !== 'none'); 
}); 

방법 플러그인 후손에 폭포가.

그러나 엄격하게 다음 $.fn을 연장 <body>에서 을 확인하는 데 문제가있는 경우에하는 것은 갈 길을 잘못처럼 들린다. $.fn 확장은 $('body').retinize() 또는 $('div img').retinize()과 같이 jQuery 객체에서 작동하는 함수를 의미합니다.

$으로 직접 확장하여 유틸리티 기능을 만들고 싶으므로 $.retinize() 등으로 부를 수 있습니다.

+0

그건 문제가되지 않습니다. 나는 이미지를 걸러 낼 수있는 코드를 가지고있다. 나는 그 어린이들만큼 요소를 선택해야한다고했다. 이렇게 :'$ (this, this *)'하지만 불행히도 작동하지 않습니다. – alt

+1

오,'$ (this) .find ('*'). andSelf()'를 사용해 보셨습니까? '.find ('*')'*를 사용하면 모든 자손을 가져와야한다. (아이들의 경우 .children()을 원한다.) .andSelf()를 호출하면 부모 컨테이너가 콜렉션에 다시 추가된다. (예 : 어린이 + 부모). –

+0

완벽한, 감사합니다! – alt

관련 문제