J'ai hérité un composant WebPart de vieux vendeur de son client et elle a un problème de taille des images. Les images doivent être 60×50 mais pour une raison étrange, le vendeur initial les contraint à 42×42, ils cherchent donc écrasés:
|
Bon Image |
Mauvaise Image |
 |
|
Voici le balisage (quelque peu simplifiées):
<Tableau de classe = « étendu-outlook »>
<THEAD>
<TR>
<Th largeur = 100′>3 Mardi</Th>
</TR>
</THEAD><tbody>
<classe TR = « prévisions »>
<largeur de TD = 100′>
<UL>
<classe Li = « high »>Haute: 72°F</Li>
<classe Li = « faible »>Faible: 44°F</Li>
<classe Li = « condition »>Sunny
<img src =’http://deskwx.Weatherbug.com/images/Forecast/Icons/localized/60×50/en/trans/cond007.PNG’ largeur = 42’ hauteur = 42’ Alt =” />
</Li>
</UL>
</TD>
</TR></tbody>
</table>
Vous remarquerez que même si la chemin d'accès à l'image de soi montre la bonne dimension (60×50) le fournisseur original l'a forcé à 42×42. Pourquoi? Crazy.
De toute façon, Je voulais une solution rapide et facile à cette question et je me tournai vers jQuery. Le truc est de localiser toutes les <img> balises. Je ne voulais pas muck avec les autres balises img (dont il existe de nombreux). Ce bit de jQuery a fait le truc:
<script type = "text/javascript" SRC ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></script>
<script type = « text/javascript »>
$(document).prêt(fonction () {$(' li.condition > img »).chaque(fonction (index, élément)
{
$(élément).CSS(« largeur », « 60 »);
$(élément).CSS(« hauteur », « 50 »);
});
}); // le chargement du document
</script>
Que le bit de code trouve la collection <Li> balises dont la classe est « condition » et <img> enfants. Puis itère tout cela. A fonctionné comme un charme.
Je pourrais probablement simplifier il, mais j'ai jamais été un genre de guy unix résoudre π À 18 précision de chiffres à l'aide de sed et awk et je ne suis pas ce genre si jQuery guy soit 
.
</fin>
Me suivre sur Twitter à http://www.twitter.com/pagalvin
