I am working on HTML+CSS+Javascript with a Java team using the JavaFX WebView renderer. I would also like to use the same HTML+CSS+Javascript in normal browsers, but I want a few minor differences in style, to optimize readability.
Is there something I can ask the JavaFX programmers to do, so that my HTML+CSS+Javascript can be "aware" of the difference? For example, a @media query, so that I can use a different CSS in WebView vs. in normal browsers.
You can ask them to include some string in the userAgent property of the WebEngine:
WebEngine engine = ...;
engine.setUserAgent(engine.getUserAgent() + " JavaFX-WebView");
You can check this property from javascript (window.navigator.userAgent), e.g.:
<!DOCTYPE html>
<html>
<head>
<title>MyPage</title>
<style>
body {
background-color: red;
}
body.javafx {
background-color: yellow;
}
</style>
</head>
<body>
<script>
var javaFX = (window.navigator.userAgent.indexOf("JavaFX-WebView") > -1);
document.body.innerHTML = javaFX ?
"Hello from JavaFX" : "Hello from Browser";
if (javaFX)
document.body.className = "javafx";
</script>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With