„Apple Pay“ nereikia kurti savo mygtukų. Tiesą sakant, „Apple“ tiesiogine to žodžio prasme jums sako, kad jūs negalite. Taigi, ką tu veiki žiniatinklyje? Laimei, „Apple“ pateikė būdą. Tai yra gana keista ir apima daugybę nuosavų CSS savybių ir vertybių, bet vis dėlto.
Jie turi dokumentaciją apie visa tai, bet aš jį pernešiu čia, kad galėtumėte pamatyti tikrąsias demonstracijas.
Štai tikslus jų siūlomas kodas:
Žr
. Chriso Coyier'io (@chriscoyier) „Pen Apple Pay“ mygtuką „
CodePen“.
Puikiai veikia „Safari“, tačiau „Chrome“ ir „Firefox“ yra tinkamai supainioti.
Nelabai stebina, nes ji naudoja fonas kaip -webkit-named-image(apple-pay-logo-white);į @supports not (-webkit-appearance: -apple-pay-button)scenarijų, kurios aš negaliu įsivaizduoti kas, bet "Apple" įgyvendinti.
Be to ... jie siūlo tuščią vietą , kuri nėra puiku.
Mes galime juos perkelti be a per daug vargo. Tiesiog reikėjo pridėti border: 0;prie „Firefox“.
Norėčiau, kad jie būtų panašesni į…
Apple Pay Bet tada mes gauname:
Bet mes galime text-indent: -9999px;to išvengti, tada įsitikinkite, kad tinkamai nustatėme spalvą, kad turėtume priimtinus semantinius mygtukus.
Žr
. Chriso Coyier'io (@chriscoyier) „Pen Apple Pay“ mygtuką „
CodePen“.
Bet labiau tikėtina ... įtarčiau pamatyti:
@supports not (-webkit-appearance: -apple-pay-button) ( .container-that-offers-apple-pay ( display: none; ) )Kaip ir čia, kodėl apskritai reikia rodyti tą sritį, jei naudojate naršyklę, kuri nepalaiko šio mokėjimo metodo.
Kitos jų demonstracinės versijos turi panašių problemų. Pvz., Mygtukas „Pirkti su“ suteikia jums:
Buy with Kuris 1) nėra mygtukas, o 2) nėra viso teksto, kuriame būtų nurodyta, kas vyksta.
Tik galva į viršų. Nesakyčiau, kad nenaudokite, bet sakyčiau, skirkite minutę laiko HTML valymui ir tinkamam stiliui, kad jis būtų suderinamas su keliomis naršyklėmis.
