이미지를 jquery로 둥근 모양으로 만듭니다.

Question

나는 jquery.imgr.js을 사용하여 이미지 파일을 원형으로 만듭니다.

데이터베이스에서 이미지를 생성하는 코드가 있습니다.

<?php 
for($i=1;$i<=5;$i++) 
{ 
?> 
<img id="hero" src="art/<?=$getArtistsId[$i];?>" height="75px" width="98px"/> 
<?php 
} 
?> 

울부 짖는 소리는 스크립트가 라운드

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $("#hero").imgr({size:"2px",radius:"10px"}); 
    }) 
    </script> 

는하지만 라운드 모든 첫 번째 이미지 코너를 만들어 작품 이미지 코너를 확인하는 것입니다.

1. 모든 이미지 모서리를 둥글게 만드는 방법은 무엇입니까?
2. 이미지를 둥근 모서리로 만드는 다른 타자와 효율적인 방법이 있습니다. 당신이 하나를 일치하는 ID를 가진 요소에 실행할 수있는 imgr 스크립트를 설정할 때

감사

Answer 1

의 ID가 고유, 당신은 너무 물론 많은 요소에 대한 ID를 설정한다. 클래스는 여러 요소에서 사용할 수 있습니다. 그래서 대신 :

<img id="hero" src="art/<?=$getArtistsId[$i];?>" height="75px" width="98px"/> 

사용 :

<img class="hero" src="art/<?=$getArtistsId[$i];?>" height="75px" width="98px"/> 

그리고 자바 스크립트에 대한 CSS 유사하다 class 선택 사용 : 루프에서

$(".hero").imgr({size:"2px",radius:"10px"}); 

Answer 2

대신 추가하고 id을 일반적인 class을 추가하십시오. $(".hero").imgr({size:"2px",radius:"10px"});

Answer 3

<img class="hero" src="art/<?=$getArtistsId[$i];?>" height="75px" width="98px"/>

클래스를 추가 한 후, 왜 그냥? ...

.hero img{ 
    border-radius: 10px; 
}