2010-12-13 4 views
2

FF, 크롬과 사파리의 다음 작품 :IE에서 이미지의 불투명도를 변경하려면 어떻게해야합니까? - jQuery를, CSS

$('#delete_img').click(function(e) { 
      var offset = $(this).offset(); 
      $(this).parent().parent().fadeTo("slow", 0.30); 
      $(this).parents("li").children("img").css({ 'border' : '3px solid #f6f6f7' }); 
      e.stopPropagation(); 
}); 

그러나 IE8에서 (I도 7에서 테스트하고 있지 않다 이전)하지 않습니다.

IE8에서이 기능을 어떻게 수행합니까?

편집 : 여기에 HTML입니다 인기 요청에 의해 : 당신은 '편집 - 이미지 탐색'에있는 아이콘 중 하나를 클릭하면

<div id="slider-code"> 
     <a class="buttons prev" href="#"></a> 
     <div class="viewport"> 
      <ul class="overview">   
       <li><img src="images/red-stripe.jpg" /></li> 
       <li><img src="images/red-stripe-bw.jpg" /></li> 
       <li><img src="images/red-stripe-red.jpg" /></li>    
       <li><img src="images/red-stripe-dark.jpg" /></li> 
       <li><img src="images/red-stripe.jpg" /></li> 
       <li><img src="images/red-stripe-red.jpg" /></li> 
       <li><img src="images/red-stripe-dark.jpg" /></li>   
      </ul>  
     </div> 
     <a class="buttons next" href="#"></a> 
    </div> 

    <div style="clear:both"></div> 

    <div id="edit-image-nav"> 
     <div id="add_comment"><img src="images/comment-icon.png" /></div> 
     <div id="like"><img src="images/paint-icon.png" /></div> 
     <div id="delete_img"><img src="images/delete-icon.png" /></div> 
    </div> 

, 무슨 일 것은 있습니다 DIV (이 onHover 위에있는 UL의 이미지 위에 오버레이됩니다.), 다른 기능을 가지고 있습니다. 다른 아이콘의 경우 작동합니다. 그러나 #delete_img의 경우에는 그렇지 않습니다.

+1

ID는 'delete_img'가 반복됩니까? –

+0

코드 어디에서나 반복됩니까? 그것이 원인일까요? 방금 JS 파일을 검색했지만 반복되지 않습니다. 마크 업에 – marcamillion

+0

내 ID가 고유해야합니다. –

답변

1

당신의 코드에서 오류 것 같다,하지만 정말 작동하지 않을 경우이 시도하지 않습니다


$('#delete_img').click(function(e) { 
      var offset = $(this).offset(); 
      $(this).parent().parent().parent().children("img").fadeTo("slow", 0.30, function() { 
        $(this).css('opacity', 0.3); 
      }); 
      $(this).parents("li").children("img").css({ 'border' : '3px solid #f6f6f7' }); 
      e.stopPropagation(); 
});

+0

아니요 ... 작동하지 않습니다. Btw,이 변경 사항이 있으면 잘 모르겠지만 이미지의 불투명도를 변경하려고합니다. '$ (this) .parent(). parent()'는 이미지입니다. – marcamillion

+0

코드를 편집 했으므로 이상하게 보입니다. 그러나 이것이 작동 할 수도 있습니다 ... –

+0

멋지다 ... 굉장합니다. 이 작동합니다. 그렇다면 IE8에서는 Safari, Chrome 또는 FF가 아닌 이유는 무엇입니까? IE가 짜증 난다는 사실을 제외하고? – marcamillion

1

이미지는 부모가 될 수 없다 (물론이 될 가능성은 매우 낮) 그래서 선택기가 잘못되었습니다. 그것은 어려운 그것은 관련 HTML 코드없이해야 무슨 말을 할 수 있지만, (당신의 삭제 버튼을 두 단계 아래로 대상을 삭제할 수에서 경우이 작동합니다) 당신은 시도 할 수 있습니다 :

$(this).parent().parent().find("img").fadeTo("slow", 0.30); 

fadeTo 방법 IE8에서 잘 작동합니다. 이것이 작동하지 않으면 html을 게시하십시오.

그렇지 않으면 img 태그의 높이와 너비가 지정되어 있어야합니다. 그렇지 않으면 IE는 "레이아웃이 없습니다"와 같이 요소에 불투명도 변경을 적용하지 않습니다. 자세한 내용은 http://www.satzansatz.de/cssd/onhavinglayout.html을 참조하십시오.

관련 문제