Pagsubaybay sa Mga Bisita sa Website Gamit ang CSS

Si Jan Brömer, isang mag-aaral sa pisika mula sa Germany na may interes sa programming, ay nag-publish ng isang halimbawa sa GitHub ng pagsubaybay sa paggalaw ng mga bisita sa mga site gamit lamang ang CSS, nang hindi gumagamit ng kapangyarihan ng JavaScript. Ang code na ibinigay ni Ian ay nagbibigay-daan, gamit ang isang pormal na wika upang ilarawan ang hitsura ng isang dokumento, upang mangolekta ng ilang partikular na impormasyon tungkol sa user - ang resolution ng screen ng kanyang device, ang uri ng browser (o engine), ang pagkakaroon ng mga tinukoy na font, at higit pa. Posible ring subaybayan ang mga link kung saan sinundan o inilipat ng user ang cursor. Gamit ang isang di-nakikitang talahanayan ng mga patlang sa background ng pahina, matutukoy mo ang mga kakaiba ng paggalaw ng mouse sa screen. Gayunpaman, maaari mong gamitin ang pamamaraan sa itaas para sa pagsubaybay lamang kung ang user ay bumisita sa pahina sa unang pagkakataon o nag-hover ng mouse sa isang partikular na cell ng isang nakatagong talahanayan, dahil ang mga paulit-ulit na pagkilos ay hindi isinasaalang-alang. Maaari mong suriin ang pagpapatakbo ng pamamaraan dito . Upang magamit ang pamamaraan, maaari kang magdagdag ng isang imahe mula sa isang panlabas na pinagmulan sa CSS gamit ang url ("foo.bar"). Dahil ang mga mapagkukunan ay na-load lamang kapag kinakailangan, sa halip na isang imahe, maaari mong tukuyin ang isang link sa isang script ng kolektor at isailalim ito sa mga kaganapan tulad ng pag-click sa isang link o paglipat ng mouse sa isang link. Para makagawa tayo ng selector sa CSS na nagti-trigger ng partikular na URL kapag nag-click ang user sa isang link:

# link2 : active :: after {
     content : url ( " track.php? action = link2_clicked " );
}

Ang pagtukoy ng uri ng browser ay batay sa mga panuntunan sa @supports . Dito kailangan mong suriin ang ilang mga katangian ng CSS para sa browser, tulad ng -webkit-appearance:

@supports ( -webkit-appearance : none ) {
     #chrome_detect :: after {
         content : url ( " track.php? action = browser_chrome " );
    }
}

Maaaring gamitin ang mga font upang matukoy ang OS ng user, dahil ang iba't ibang OS ay nagpapadala ng iba't ibang mga font (halimbawa, "Calibri" sa Windows). Upang tukuyin ang isang font, kailangan mong lumikha ng bagong pamilya ng font, ang pinagmulan para sa paglo-load na magiging script ng pagkolekta ng data. Susunod, sa bloke ng teksto, ang font na sinusuri ay ipinahiwatig muna, at ang font mula sa bagong pamilya ay ipinahiwatig na pangalawa. Susunod, susubukan ng teksto na i-istilo ang font; kung ang unang font ay naroroon, ang pangalawa ay hindi papansinin. Ngunit kung walang font na susuriin, susubukan ng browser na gumamit ng dummy font bilang isang fallback at magpadala ng kahilingan sa isang panlabas na script:

@ font-face {
     font-family : Font1;
    src : url ( " track.php? action = font1 " );
}

# font_detection1 {
     font-family : Calibri, Font1;
}

Kung pagkatapos gamitin ang pamamaraan ay walang mga resulta, o may lalabas na babala sa PHP, nangangahulugan ito na mali ang value ng property o hindi pa binibisita ng user ang page/link.