When I want to set the <textarea>'s background transition on hover, it succeeds. However, when I try to resize it, the transition time still works. Here is my code, you can drag <textarea> to see what's wrong: textarea::-webkit-resizer:active{transition:0s;}textarea:hover{background:rgb(200,200,200);}tex

Is there a way to make a textarea not show CSS transforms when resized?-PHP Chinese Network Q&A

Community

Learn

Tools Library

AI Tools

Leisure

English

Is there a way to make a textarea not show CSS transforms when resized?

P粉785957729 2024-04-03 17:02:11

501

When I want to set the background transition of <textarea> on hover, it works. However, when I try to resize it, the transition time still works.

This is my code, you can drag <textarea> to see what's wrong:

textarea::-webkit-resizer:active {
  transition:0s;
}
textarea:hover{
  background:rgb(200,200,200);
}


textarea{
  transition:1s;
}

<textarea></textarea>

I'm looking for a way to not perform a transition while dragging.

P粉785957729

reply all(1)

P粉6337331462024-04-04 11:03:45 1 floor

This problem can be solved by specifying the CSS property to be converted to, in which case specifying the background color will solve the problem:

textarea::-webkit-resizer:active {
  transition: 0s;
}

textarea:hover {
  background: rgb(200, 200, 200);
}

textarea {
  transition: background-color 1s;
}

Like +0

Add Reply