Jag ärvt en webbdel från en gammal klienttillverkaren och har ett imageproblem storlek. Bilderna ska vara 60×50 men av någon udda anledning, den ursprungliga leverantören tvingade dem till 42×42, så det ser ut squashed:
|
Bra bild |
Dålig bild |
 |
|
Här är markering (något förenklat):
<tabell klass = "extended-outlook">
<thead>
<TR>
<TH bredd = 100′>3 Tisdag</TH>
</TR>
</thead><tbody>
<TR klass = "prognos">
<TD bredd = "100′>
<UL>
<Li klass = 'hög'>Hög: 72°F</Li>
<Li klass = "låg">Låg: 44°F</Li>
<Li klass = "villkor">Soliga
<img src =’http://deskwx.WeatherBug.com/images/Forecast/icons/Localized/60×50/en/trans/cond007.PNG’ Bredd ='42’ höjd ='42’ ALT =” />
</Li>
</UL>
</TD>
</TR></tbody>
</tabell>
Du ska notera att även om den sökvägen till själva bilden visar korrekt (60×50) den ursprungliga leverantören tvingade det 42×42. Varför? Galen.
Hur som helst, Jag ville ha en snabb och enkel lösning på denna fråga och jag vände sig till jQuery. Tricket var att hitta alla de tillämpliga <IMG> taggar. Ville inte dölja med andra img-taggar (som finns det många). Denna bit av jQuery gjorde tricket:
<skript type = "text/javascript" src ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></skript>
<skript type = "text/javascript">
$(dokument).redo(funktionen () {$("li.condition > IMG ").varje(funktionen (index, objekt)
{
$(objekt).CSS("bredd", "60");
$(objekt).CSS("höjd", "50");
});
}); // Om dokumentet belastning
</skript>
Den biten av kod finner insamling <Li> Märken vars klass är "villkor" och <IMG> barn. Det går sedan igenom allt detta. Arbetade som en charm.
Jag skulle förmodligen effektivisera det, men jag aldrig var en slags unix kille som löst π till 18 siffror precision med hjälp av sed och awk och jag är inte sådan om jQuery guy antingen 
.
</slutet>
Följ mig på Twitter vid http://www.twitter.com/pagalvin