0

I am trying to load a local HTML file using the WebView component. Everything works fine except the CSS transitions. Here is my HTML file

<!DOCTYPE html>

<html>
    <head>
        <title>HTML GUI</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style>

            input[type=text]{
                padding: 5px;
                text-align: center;
                -webkit-transition: width 2s;
                transition: width 2s;
            }

            input[type=text]:focus{
                width: 80%;
            }

        </style>
    </head>
    <body>
        <div id="welcomeText">Welcome</div>

        <div id="user-block">
            <label>User Name:</label>
            <input type="text"/>
        </div>

        <div id="pw-block">
            <label>Password:</label>
            <input type="text"/>
        </div>

    </body>
</html>

The issue is that whenever I click on the input, the transition happens instantly. The transition time is completely ignored. Am I doing something wrong? Are transitions even supported by the WebView? NOTE: I am using JDK 8 (1.8).

UPDATE: FIXED I have managed to fix it by specifying a width for the input...

Improve this question
2
  • Does it help to place the transition properties in the input[type=text]:focus block? Commented Sep 12, 2019 at 13:28
  • Same issue. I have managed to fix it by specifying a width for the input... Commented Sep 12, 2019 at 18:28
Related questions
10
How can I use android transition effects in web view?
1
JavaFX 2.2 WebView
0
Why is WebView content fading out (disappearing)?
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.