Search code examples
javascriptcsstwitter-bootstrapmedia-querieskindle-fire

Detect Kindle Fire in CSS or JS

I have a website based on Twitter Bootstrap. Whenever I move around the site on a Kindle Fire the nav-bar, which is meant to be fixed to the top of the viewport, takes a second to catch up and move there. It looks ugly as. The navbar stays fixed on the viewport on all other devices - ipad, samsung s3, desktop.

Is it possible to detect the Kindle Fire via CSS or javascript so that I can fix the navbar to the page rather than the viewport for misbehaving browsers?

Solution

  • You can sniff the user agent for the Silk browser with javascript. e.g.

    if (navigator.userAgent.indexOf("Silk") !== -1) {
    // This is the Kindle Fire's Silk browser.
}