Eu herdei uma web part de fornecedor antigo do cliente e tem um problema de tamanho de imagem. As imagens devem ser 60×50 mas por algum motivo estranho, o fornecedor original forçou-os em 42×42, para que eles tenham aparência achatados:
|
Boa imagem |
Imagem ruim |
 |
|
Aqui está a marcação (um pouco simplificado):
<classe de tabela = 'estendido-outlook'>
<thead>
<TR>
<th largura = 100′>3 Terça-feira</th>
</TR>
</thead><tbody>
<Classe TR = 'tempo'>
<largura de TD = 100′>
<UL>
<Classe Li = 'alta'>Alta: 72°F</Li>
<Classe Li = 'baixa'>Baixo: 44°F</Li>
<Classe Li = 'condição'>Ensolarado
<img src =’http://deskwx.WeatherBug.com/images/Forecast/Icons/localized/60×50/en/trans/cond007.png’ Largura = 42’ altura = 42’ ALT =” />
</Li>
</UL>
</TD>
</TR></tbody>
</tabela>
Você notará que, embora o caminho para a própria imagem mostra a dimensão adequada (60×50) o fornecedor original forçou-42.×42. Por que? Louco.
De qualquer forma, Eu queria uma solução rápida e fácil para esse problema e eu me virei para jQuery. O truque foi localizar todos os apropriado <img> marcas de formatação. Eu não queria Muck com quaisquer outras tags img (de que há muitos). Este pouco de jQuery feito a manha:
<script type = "text/javascript" src ="http://AJAX.googleapis.com/AJAX/libs/jQuery/1.5/jQuery.min.js"></script>
<script type = "text/javascript">
$(documento).pronto(função () {$(' li.condition > img').cada(função (índice, item de)
{
$(item de).CSS("largura", "60");
$(item de).CSS("altura", "50");
});
}); // carga do documento
</script>
Esse pedaço de código localiza a coleção <Li> marcas cuja classe é "condição" e <img> crianças. Ele, em seguida, itera Tudo isso. Trabalhou como um encanto.
Eu provavelmente poderia simplificar ele, mas eu nunca fui um o tipo de cara de unix que resolveu π Para 18 precisão de dígitos usando sed e awk e eu não sou desse tipo se jQuery cara quer 
.
</fim>
Siga-me no Twitter em http://www.twitter.com/pagalvin
