Jeg har arvet en webdel fra en klient gamle leverandør, og det har et imageproblem størrelse. Billederne bør 60×50 Men for nogle underlige grund, den oprindelige forhandler tvunget dem til 42×42, så de ser squashed:
|
Godt billede |
Dårligt Image |
 |
|
Her er opmærkningen (lidt forenklet):
<tabel class = 'extended-outlook'>
<thead>
<Tr>
<th bredde ='100′>3 Tirsdag</th>
</Tr>
</thead><TBODY>
<TR class = "prognose">
<TD bredde ='100′>
<UL>
<Li klasse = 'høj'>Høj: 72&DEG;F</Li>
<Li class = "lavt">Lav: 44&DEG;F</Li>
<Li class = "stand">Solrig
<img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/Trans/cond007.png’ bredde ='42’ højde ='42’ alt =” />
</Li>
</UL>
</TD>
</Tr></TBODY>
</tabel>
Du vil bemærke, at selv om den stien til selve billedet viser den korrekte dimension (60×50) den oprindelige leverandør tvunget det i 42×42. Hvorfor? Tosset.
Alligevel, Jeg ønskede en hurtig og nem løsning på dette spørgsmål, og jeg vendte til jQuery. Tricket var at finde alle de relevante <IMG> Tags. Jeg gjorde ikke ønsker at nusse rundt med andre img-tags (hvoraf er der mange). Denne bit af jQuery gjorde tricket:
<script type = text/javascript"" src ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></script>
<script type = "tekst/javascript">
$(dokument).klar til(funktion () {$(' li.condition > IMG').hver(funktion (indeks, varen)
{
$(varen).CSS("bredde", "60");
$(varen).CSS("højde", "50");
});
}); // på dokumentet belastning
</script>
Smule kode finder samlingen <Li> Tags hvis klassen er "tilstand" og <IMG> børn. Det gentages derefter gennem alt dette. Arbejdede lige en indtage.
Jeg kunne nok strømline it, men jeg har aldrig været en form for unix fyr, der løst π til 18 cifre præcision ved hjælp af sed og awk og jeg er ikke slags, hvis jQuery fyr enten 
.
</slutningen>
Følg mig på kvidre på http://www.twitter.com/pagalvin
