I think I know what you're talking about with the height jittering, but not exactly sure. You'll need to elaborate on what exactly is jittering.
My first guess after a quick skim is that you're talking about the task actions appearing and disappearing really quickly. Looks like you have a mouseover event on the whole cards div <div class="cards"> that adds the <div class="actionsDiv">, and then a mouseout event that removes the <div class="actionsDiv">.
I think instead of creating the actionsDiv via JS and having events append and remove it, you could write in the actionsDiv into the HTML to begin with. Then you would use your mouseon/out events to change the CSS as necessary. See "#11: Make some content visible only for screen readers" of this post for an example.
Also, I think you might need to make your <div class="cards"> larger with some padding or margins (or something), so when you hover over it and hover your cursor into the actionsDiv, the cursor won't exit the cards div completely and hide the actionsDiv.
Hope that helps!
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
I think I know what you're talking about with the height jittering, but not exactly sure. You'll need to elaborate on what exactly is jittering.
My first guess after a quick skim is that you're talking about the task actions appearing and disappearing really quickly. Looks like you have a mouseover event on the whole cards div
<div class="cards">
that adds the<div class="actionsDiv">
, and then a mouseout event that removes the<div class="actionsDiv">
.I think instead of creating the actionsDiv via JS and having events append and remove it, you could write in the actionsDiv into the HTML to begin with. Then you would use your mouseon/out events to change the CSS as necessary. See "#11: Make some content visible only for screen readers" of this post for an example.
Also, I think you might need to make your
<div class="cards">
larger with some padding or margins (or something), so when you hover over it and hover your cursor into theactionsDiv
, the cursor won't exit the cards div completely and hide the actionsDiv.Hope that helps!