CSS :hover Selector On ActiveX Control

tqphan · 15 Jun 2020, 16:10

I have the following html/css loaded on an ActiveX control. When I move my mouse very fast over the elements, sometimes multiple elements are stuck on hover. This behavior doesn't exist if I load the page using all major browsers including IE 11. My ActiveX is using IE 11.
Here's a gif to illustrate what I am experiencing:

Code: Select all

<!DOCTYPE html>
<html>
<head>
<style>
.flex-container {
  display: flex;
  flex-wrap: nowrap;
  background-color: DodgerBlue;
}

.flex-container > div {
  background-color: #f1f1f1;
  width: 100px;
  margin: 10px;
  text-align: center;
  line-height: 75px;
  font-size: 30px;
}
.flex-container > div:hover {
    background-color:cadetblue;
  }
</style>
</head>
<body>
<h1>Flexible Boxes</h1>

<div class="flex-container">
  <div>1</div>
  <div>2</div>
  <div>3</div>  
  <div>4</div>
  <div>5</div>
  <div>6</div>  
  <div>7</div>
  <div>8</div>
</div>

<p>Try to resize the browser window.</p>
<p>A container with "flex-wrap: nowrap;" will never wrap its items.</p>
<p><strong>Note:</strong> Flexbox is not supported in Internet Explorer 10 or earlier versions.</p>

</body>
</html>

teadrinker · 15 Jun 2020, 16:45

Tried your html, can't reproduce the issue.

tqphan · 15 Jun 2020, 16:53

Would you mind posting your ahk script? maybe something on my side is causing it.

teadrinker · 15 Jun 2020, 17:01

Code: Select all

html =
(
<!DOCTYPE html>
<html>
<head>
<style>
.flex-container {
  display: flex;
  flex-wrap: nowrap;
  background-color: DodgerBlue;
}

.flex-container > div {
  background-color: #f1f1f1;
  width: 100px;
  margin: 10px;
  text-align: center;
  line-height: 75px;
  font-size: 30px;
}
.flex-container > div:hover {
    background-color:cadetblue;
  }
</style>
</head>
<body>
<h1>Flexible Boxes</h1>

<div class="flex-container">
  <div>1</div>
  <div>2</div>
  <div>3</div>  
  <div>4</div>
  <div>5</div>
  <div>6</div>  
  <div>7</div>
  <div>8</div>
</div>

<p>Try to resize the browser window.</p>
<p>A container with "flex-wrap: nowrap;" will never wrap its items.</p>
<p><strong>Note:</strong> Flexbox is not supported in Internet Explorer 10 or earlier versions.</p>

</body>
</html>
)
Gui, +Resize
Gui, Margin, 0, 0
Gui, Add, ActiveX, w700 h300 vWB, about:<meta http-equiv="X-UA-Compatible" content="IE=edge">
WB.document.write(html)
Gui, Show
Return

GuiSize:
   GuiControl, Move, WB, w%A_GuiWidth% h%A_GuiHeight%
   Return

GuiClose:
   ExitApp

CSS :hover Selector On ActiveX Control

CSS :hover Selector On ActiveX Control

Re: CSS :hover Selector On ActiveX Control

Re: CSS :hover Selector On ActiveX Control

Re: CSS :hover Selector On ActiveX Control

Who is online