Share
Vår responsive utforming kommer i sprang, så la oss skru opp det enda lenger! I dag ser vi på ulike jQuery-plugins som vi bruker til å trekke Twitter og Flickr-feeds inn på siden vår, pluss en responsiv glidebryter for våre funksjoner på toppen.
Merk: Det er verdt å nevne at noen av jQuery-pluginene nevnt i denne opplæringen kan være utdaterte (for eksempel, Twitter har gjort endringer i deres API som forhindrer Tweet! Fra å fungere). Du er velkommen til å prøve alternativer og dele dine tanker i kommentarene!
Før vi begynner å implementere ulike jQuery-leker, la oss først rydde opp vår footer-område. Vi skal takle diagonal linje styling bak h4 elementene, plassere vår sekundære logo, legge til generisk dummy innhold og fullføre styling lister.
Alternativt kan du laste ned videoen eller abonnere på Webdesigntuts + screencasts via iTunes eller YouTube!
Etter å ha håndtert det meste av stylingen, kan vi nå gripe Twitter og Flickr jQuery plugins som vil trekke inn feeds i dokumentet vårt. Da vi begynner å legge ganske mye kode til foten av vår side, gjør vi et poeng med å samle alt sammen i en enkelt .js-fil.
Alternativt kan du laste ned videoen eller abonnere på Webdesigntuts + screencasts via iTunes eller YouTube!
Sist, men ikke minst, den responsive glidebryteren. Vi bruker den svært dyktige Flexslider-plugin (nylig kjøpt av WooThemes) og implementerer den for å vise frem noen PhotoDune-bilder.
Alternativt kan du laste ned videoen eller abonnere på Webdesigntuts + screencasts via iTunes eller YouTube!
Noen nyttige lenker til å bygge videre på hva som er dekket i disse videoene.
Bilder med tillatelse til PhotoDune.
Accentsconagua