4

When i move cursor on link it shows with hover style and it's good. When i move cursor back from link hover disappear and it's good.

But when i click on link hover looks stay even if i move cursor back. Why? What am i doing wrong? How to solve that?

I have never had this problem when using only bootstrap without AngularJS.

Page: http://wladyka.eu/d/#/

Demonstration of problem: enter image description here

Community
  • 1
  • 1
kabra
  • 1,306
  • 1
  • 17
  • 24
  • check this: http://stackoverflow.com/questions/33584392/bootstraps-tooltip-doesnt-disappear-after-button-click-mouseleave – Reza Afzalan May 11 '17 at 13:47

3 Answers3

2

You need to override bootsrap :focus pseudo class for .btn-link: 

.navbar-default .btn-link:focus {
    color: #777;
    text-decoration: none;
}
dfsq
  • 191,768
  • 25
  • 236
  • 258
  • But why is it happening? It is not standard behavior of this framework :) What cause this problem? I want to also understand this :) – kabra Feb 19 '15 at 11:09
  • Actually this is built-in Bootsrtap styles for `btn-link` class: `.navbar-default .btn-link:hover, .navbar-default .btn-link:focus {color: #333;}`. – dfsq Feb 19 '15 at 11:12
1

You have to overwrite the css for the :active and the :focus state of the button

Pinki
  • 1,042
  • 9
  • 17
1

Actually your anchor is focused you need to remove it Can be acheive it by :-

$("#your_id").mouseup(function(){
    $(this).blur();
})

Fiddle

squiroid
  • 13,809
  • 6
  • 47
  • 67