Dar daugiau jQuery–Keisti vaizdo pavyzdys

Aš paveldėtas žiniatinklio dalį iš kliento senas tiekėjo ir ji vaizdo dydžio problema.  Vaizdai turi būti 60×50 Tačiau kai kurių nelyginis priežasties, pradinio tiekėjo privertė juos į 42×42, Taigi jie atrodo squashed:

 

Gera vaizdo

Bloga vaizdo

Čia yra žymėjimas (šiek tiek supaprastinta):

<lentelės klasės = "išplėsti programos outlook">
  <thead>
    <TR>
      <TH  plotis = "100′>3 Antradienis</TH>
    </TR>
  </thead>

  <tbody>
    <TR klasės = "Oras">
      <TD plotis = "100′>
        <UL>
          <Li klasės = "aukšto">Didelis: 72&DEG;F</Li>
          <Li klasės = "mažas">Žemas: 44&DEG;F</Li>
          <Li klasės = "sąlygos">Saulės
            <img src =’
http://deskwx.weatherbug.com/images/Forecast/Icons/localized/60×50/EN/trans/cond007.png’ plotis = "42’ aukštis = "42’ ALT =” />
          </Li>
        </UL>
      </TD>
    </TR>

  </tbody>

</lentelė>

Jums bus pažymėti, kad nors, kelias į vaizdą, pati rodo tinkamą dimensija (60×50) pradinio tiekėjo privertė ją 42×42.  kodėl?  pakvaišęs.

Bet kokiu atveju, Aš norėjau greitai ir lengvai išspręsti šį klausimą ir aš pasuko į jQuery.  Norėdami rasti visus atitinkamo buvo pavyko <IMG> Žymos.  Aš nenorėjo išmesti laiminčią su kitų img žymės (kurios yra daug).  JQuery šiek tiek padarė pavyko:

<scenarijaus tipas = "text/javascript" src ="http://Ajax.googleapis.com/Ajax/libs/JQuery/1.5/JQuery.min.js"></scenarijų>

<scenarijaus tipas = "text/javascript">
     $(dokumento).paruošta(funkcija () {

         $("li.condition > IMG ").Kiekviena(funkcija (indeksas, prekės)
           
{
             $(prekės).CSS("plotis", "60"); 
             $(prekės).CSS("aukštis", "50");
            });
     }); // dėl dokumento apkrovos
</scenarijų>

Kad šiek tiek kodas nustato, rinkimo <Li> Žymos, kurio klasė yra "sąlyga" ir <IMG> vaikai.  Jis tada kartoja per visa tai.  Dirbo kaip Šarm.

Aš tikriausiai galėtų racionalizuoti ji, bet aš niekada buvo a tipo unix vaikinas, kad išspręsti 2π × į 18 skaitmenų tikslumas, naudojant sed ir awk ir aš ne tokio pobūdžio jei jQuery vaikinas, arba šypsena.

</pabaigos>

Prenumeruoti savo dienoraštį.

Sekite mane Twitter ne http://www.twitter.com/pagalvin

palik atsakymą

Jūsų elektroninio pašto adresas nebus skelbiamas. Privalomi laukai yra pažymėti *