Google Fonts fungerer ikke i Kina - Slik løser du det

Grunnen til at vi bruker Google API for å vise biblioteker som jQuery og Web Fonts, er at den tjener fort gjennom Googles pålitelige infrastrukturer. Den brukes nesten overalt, og så mye at noen brukere allerede har cachen lagret i nettleseren, noe som gjør at bibliotene lastes enda raskere.

Dessverre er det ikke tilfellet i Kina. Kinas regjering stengte tilgang til mange av Googles tjenester, inkludert Google API, i 2014. Sjansen er at nettstedet ditt kan vises delvis ødelagt i Kina, fordi jQuery og web-fonter som er vert i Google, er utilgjengelige.

I dette innlegget skal vi se hvordan vi går forbi Kinas "digitale" Great Wall, slik at nettstedet vårt kan løpe som hvordan det blir sett utenfor Kina. Vi skal bruke et alternativ skriftbibliotek som speiler Google Fonter og biblioteker, men først må vi sette inn noen tiltak for å identifisere brukere som hagler fra Kina.

Identifisere brukerplassering

Til å begynne med må vi finne hvor vår besøkende kommer fra og for å gjøre det, vi bruker denne WIPMania API som tillater henting av en besøkers geolokasjon, inkludert landets navn:

 $ .getJSON ('http://api.wipmania.com/jsonp?callback=?', funksjon (data) {swal ('Du er fra', data.address.country);}); 

Vi bruker jQuery $.getJSON å ringe til API. Vi sender deretter data.address.country som skal fortelle oss hvor den besøkende er fra. Her er en demonstrasjon.

Gir Alternative Web Font Source

Så nå som vi kan hente vår besøkendes beliggenhet, skal vi erstatte Google Fonts med Useso-biblioteker, en CDN-tjeneste som speiler fonter og biblioteker fra Google API, for å betjene besøkende fra Kina.

På dette stadiet har vi fortsatt skrifttypestiler som peker på Google API:

Vi erstatter href i linkelementet med en JavaScript-funksjon.

 funksjon () / ', ' //fonts.useso.com/ '); $ (dette) .attr (' href ', $ erstatte);}); } 

Denne funksjonen erstatter hver lenke for å henvise til //fonts.useso.com/ i stedet for å peke til Google API-adressen, //fonts.googleapis.com/ .

Funksjonen vil bare løpe når den besøkende er fra CN, Kinas internasjonale landskode.

 $ .getJSON ('http://api.wipmania.com/jsonp?callback=?', funksjon (data) {if (data.address.country_code == 'CN') {replaceGoogleCDN ();}}); 

Vi er alle satt. Nå vil besøkende fra Kina bli servert skrifter via //fonts.useso.com/ som ikke er blokkert av den kinesiske regjeringen.

15 jQuery-plugger for å lage smart, klare elementer

Det er nå vanlig å se visse elementer på et nettsted som er festet til en posisjon når du ruller opp eller ned på siden, for eksempel navigasjonsmenyen, overskriften eller sidebjelken. Dette gjør at elementet er lett tilgjengelig uavhengig av brukerens posisjon.Kalt et klebrig element, dette kan oppnås bare ved å bruke CSS, men ved hjelp av denne metoden er effekten ikke pålitelig på tvers av flere nettlesere. Det er d

(Tekniske og design tips)

Fantastiske tegninger som kommer til live før øynene dine

God kunst kan fremkalle en rekke følelser, men god kunst gjør noe mer. Ramon Bruin, som kommer fra Nederland, er en bemerkelsesverdig talentfull artist som skaper optiske illusjoner på papir . Han har selv fått et navn for det, 'Optisk Illusjonisme'. Det er en kombinasjon av tegning, fotografering og den riktige kameravinkelen som klarer å gi den den effekten han ønsker.Hans

(Tekniske og design tips)