클라이언트의 오래 된 공급 업체에서 웹 파트를 상속 하 고 이미지 크기 문제. 이미지 60 되어야 합니다.×50 하지만 어떤 이상한 이유로, 원래 공급 업체 42에 그들을 강제로×42, 그래서 그들은 찌그러져 보이는:
좋은 이미지 |
나쁜 이미지 |
여기 태그가입니다. (다소 단순화):
<클래스 표 ' 확장 outlook'=>
<thead>
<tr>
<th 폭 = 100'′>3 화요일</th>
</tr>
</thead><tbody>
<tr 클래스 '예측' =>
<td 폭 = 100'′>
<ul>
<리 클래스 '높은' =>높은: 72°F</리>
<리 클래스 '낮은' =>낮은: 44°F</리>
<리 클래스 = '조건'>써니
<img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/trans/cond007.png’ 너비 ='42’ 높이 ='42’ alt =” />
</리>
</ul>
</td>
</tr></tbody>
</테이블>
비록 유의 거는 이미지 자체에 대 한 경로 적절 한 치수를 보여 줍니다. (60×50) 원래 공급 업체 42에 강제×42. 왜? 미친.
어쨌든, 이 문제에 빠르고 쉬운 솔루션을 원했습니다 및 jQuery 밝혀졌다. 트릭은 모든 적절 한을 찾을 수 <img> 태그입니다. 다른 img 태그에 대해 정처 없이 헤매 다 싶지 않 았 어 (많습니다.). JQuery의이 비트는 목적을 달성을 했다:
<스크립트 유형 = "텍스트/자바 스크립트" src ="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></스크립트>
<스크립트 유형 = "텍스트/자바 스크립트">
$(문서).준비(함수 () {$(' li.condition > 그림 ').각(함수 (인덱스, 항목)
{
$(항목).css("너비", "60");
$(항목).css("높이", "50");
});
}); // 문서 로드에
</스크립트>
코드의 그 비트 컬렉션 발견 <리> 태그의 클래스는 "상태"와 <img> 아이 들. 그것은 그때 모든 것을 반복합니다. 마법 처럼 일했다.
아마 그것을 간소화할 수 있습니다., 하지만 난 결코 한 π 해결 유닉스 사람의 종류 받는 사람 18 sed와 awk를 사용 하 여 숫자 정밀도 아니에요 그런 jQuery가 중 하는 경우 .
</끝>
에 지 저 귐에 나를 따르라합니다 http://www.twitter.com/pagalvin