Έχω κληρονομήσει ένα τμήμα web από παλιά προμηθευτή του πελάτη και να έχει ένα πρόβλημα μέγεθος εικόνας. Οι εικόνες πρέπει να είναι 60×50 αλλά για κάποιο περίεργο λόγο, τον αρχικό προμηθευτή τους εξανάγκασε σε 42×42, έτσι φαίνονται στριμωγμένος:
|
Καλή εικόνα |
Κακή εικόνα |
 |
|
Εδώ είναι το περιθώριο κέρδους (κάπως απλουστευμένη):
<Πίνακας τάξη = 'επεκταθεί-outlook'>
<thead>
<TR>
<ου πλάτος = 100′>3 Τρίτη</ου>
</TR>
</thead><TBODY>
<Κλάση TR = «πρόβλεψη»>
<πλάτος TD = 100′>
<UL>
<Li τάξη = «υψηλή»>Υψηλή: 72&DEG;F</Li>
<Li τάξη = «χαμηλής»>Χαμηλή: 44&DEG;F</Li>
<Li τάξη = «κατάσταση»>Ηλιόλουστη
<img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/EN/trans/cond007.png’ πλάτος ='42’ ύψος ='42’ ALT =” />
</Li>
</UL>
</TD>
</TR></TBODY>
</Πίνακας>
Θα σημειωθεί ότι ακόμα κι αν το διαδρομή για την ίδια την εικόνα δείχνει την σωστή διάσταση (60×50) ανάγκασε τον αρχικό προμηθευτή σε 42×42. Γιατί? Τρελό,.
Ούτως ή άλλως, Θα ήθελα μια γρήγορη και εύκολη λύση σε αυτό το θέμα και γύρισα να jQuery. Το κόλπο ήταν να εντοπίσει όλα τα κατάλληλα <img> Ετικέτες. Δεν ήθελα να βόρβορος σχετικά με οποιεσδήποτε άλλες ετικέττες img (των οποίων υπάρχουν πολλές). Αυτό το κομμάτι της jQuery έκανε το κόλπο:
<σενάριο τύπο = text/javascript"" src ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></σενάριο>
<σενάριο τύπο = "text/javascript">
$(έγγραφο).έτοιμο(συνάρτηση () {$(«li.condition > img»).κάθε(συνάρτηση (Δείκτης, στοιχείο)
{
$(στοιχείο).CSS("Πλάτος", "60");
$(στοιχείο).CSS("ύψος", "50");
});
}); // έγγραφο φορτίο
</σενάριο>
Εκείνο το κομμάτι του κώδικα που βρίσκει τη συλλογή <Li> Ετικέτες κατηγορίας του οποίου είναι "κατάσταση" και <img> τα παιδιά. Στη συνέχεια εκτελεί επαναλήψεις μέσα από όλα αυτά. Έλυσα αρέσω έναs γοητεία.
Εγώ κατά πάσα πιθανότητα θα μπορούσε να βελτιώσει αυτό, αλλά ποτέ δεν ήμουν ένα το είδος τύπου unix που έλυσε π να 18 ψηφία ακρίβεια χρησιμοποιώντας sed και awk και δεν είμαι αυτού του είδους, αν jQuery τύπος είτε 
.
</Τέλος>
Συνέχεια μου για Twitter σε http://www.twitter.com/pagalvin
