Saya mewarisi sebahagian dari web vendor berusia pelanggan dan ia mempunyai masalah saiz imej. Imej harus 60×50 tetapi atas sebab tertentu ganjil, vendor asal memaksa mereka ke dalam 42×42, supaya mereka melihat dihapuskan:
|
Imej Baik |
Bad Image |
 |
|
Berikut adalah markup (agak dipermudahkan):
<jadual class = 'dilanjutkan pandangan'>
<thead>
<tr>
<ke width = '100′>3 Selasa</ke>
</tr>
</thead><tbody>
<tr class = 'ramalan'>
<td width = '100′>
<st>
<li class = 'tinggi'>Tinggi: 72&anda;F</li>
<li class = 'rendah'>Rendah: 44&anda;F</li>
<li class = 'keadaan'>Sunny
<img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/trans/cond007.png’ width = '42’ height = '42’ alt =” />
</li>
</st>
</td>
</tr></tbody>
</jadual>
Anda akan ambil perhatian bahawa walaupun laluan kepada imej itu sendiri menunjukkan dimensi yang betul (60×50) vendor asal memaksanya di 42×42. Mengapa? Gila.
Bagaimanapun, Saya mahu satu penyelesaian yang cepat dan mudah untuk isu ini dan saya beralih kepada jQuery. Silap mata adalah untuk mencari semua yang sesuai <img> tag. Saya tidak mahu bergelandangan dengan mana-mana tag img lain (di mana terdapat banyak). Ini sedikit jQuery tidak menipu:
<skrip jenis = text/javascript"" src ="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></skrip>
<skrip jenis = "text/javascript">
$(dokumen).bersedia(fungsi () {$(' li.condition > img ').setiap(fungsi (indeks, item)
{
$(item).css("lebar", "60");
$(item).css("ketinggian", "50");
});
}); // beban dokumen
</skrip>
Itulah sedikit kod mendapati koleksi <li> tag yang kelas adalah "keadaan" dan <img> kanak-kanak. Ia kemudian iterates melalui semua itu. Bekerja seperti azimat.
Saya mungkin boleh menyelaraskan ia, tetapi saya tidak pernah menjadi jenis unix lelaki yang diselesaikan π kepada 18 digit ketepatan menggunakan sed dan awk dan saya bukan jenis yang jika lelaki jQuery sama ada 
.
</akhir>
Mengikuti aku di Twitter http://www.twitter.com/pagalvin
