Eu herdei unha parte web do antigo provedor de un cliente e el ten un problema de tamaño da imaxe. As imaxes deben ser de 60×50 pero por algún motivo estraño, o provedor orixinal forzado los 42×42, para que queden esmagados:
|
Boa Imaxe |
Bad Image |
 |
|
Aquí está o marcado (tanto simplificada):
<mesa class = "extended-Outlook '>
<thead>
<tr>
<º width = '100′>3 Martes</º>
</tr>
</thead><tbody>
<tr class = 'previsión'>
<td width = '100′>
<ª>
<li class = "alto">Alto: 72&ti;F</li>
<li class = 'baixa'>Baixo: 44&ti;F</li>
<li class = 'condición'>Soleado
<img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/trans/cond007.png’ width = '42’ height = '42’ alt =” />
</li>
</ª>
</td>
</tr></tbody>
</mesa>
Vai notar que, aínda que o camiño cara á propia imaxe amosa a dimensión axeitada (60×50) o provedor orixinal forzado en 42×42. ¿Por que? Tolo.
De calquera xeito, Eu quería unha solución rápida e fácil a esta cuestión e eu me virei para jQuery. O truco era localizar as apropiado <img> etiquetas. Eu non quería muck sobre con calquera outras etiquetas img (de que son moitos). Este pouco de jQuery fixo o truco:
<script type="text/javascript" src ="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></guión>
<script type="text/javascript">
$(documento).preparado(función () {$(‘li.condition > img ').cada(función (índice, elemento)
{
$(elemento).css("width", "60");
$(elemento).css("height", "50");
});
}); // na carga documento
</guión>
Este anaco de código atopa a colección <li> marcas cuxa clase é "condición" e <img> nenos. A continuación, el percorre todo isto. Traballou como un encanto.
Eu probablemente podería acelerar isto, pero eu nunca fun un tipo de unix cara que resolveu π para 18 díxitos de precisión usando sed e awk, e eu non son ese tipo cara jQuery ou 
.
</final>
Siga-me no Twitter http://www.twitter.com/pagalvin
