bordure bleue sur JScrollPane div

Question

exemple en direct: http://www.legodata.com/kc/kc.html

J'ai un problème d'affichage de la frontière avec JScrollPane, voulez-vous savoir quelle règle css à utiliser pour supprimer cette frontière? Lorsque vous cliquez à l'intérieur de celui-ci, il affiche une bordure bleue autour de la div jScrollPane, il disparaît (parfois) lorsque vous cliquez en dehors de la div jScrollPane.

Il ressemble à ceci:

Voici le CSS actuel:

background-color: transparent; 
border-bottom-width: 0px; 
border-left-width: 0px; 
border-right-width: 0px; 
border-top-width: 0px; 
bottom: auto; 
color: #999E92; 
display: block; 
float: right; 
font-family: VerdanaArial, Helvetica, sans-serif; 
font-size: 16px; 
height: 802px; 
left: auto; 
margin-bottom: 0px; 
margin-left: 0px; 
margin-right: 0px; 
margin-top: 0px; 
overflow-x: hidden; 
overflow-y: hidden; 
position: relative; 
right: auto; 
top: auto; 
visibility: visible; 
width: 200px; 
z-index: 1; 

Je peux reproduire ce problème dans Chrome et Safari (non testé dans d'autres endroits).

Answer 1

Essayez d'ajouter outline: none; à votre css

Answer 2

outline: none; fonctionnera, mais s'il vous plaît être conscient que cela est un comportement par défaut du navigateur Chrome, FF et Safari et il sera difficile pour les personnes malvoyantes de naviguer sur votre site. Assurez-vous de l'ajouter uniquement aux éléments non navigables sur votre page.

Presse

Option + tab

pour voir la structure de navigation de votre site montré les lecteurs d'écran, etc. Et cela va aussi montrer où le contour apparaît sur vos autres éléments ! :)

Answer 3

Tout ce que vous avez à faire est d'ajouter la ligne suivante dans votre CSS.

.jScrollPaneContainer{ 
    outline: 0 none; 
} 

Answer 4

Lorsque vous initialisez JScrollPane, utilisez le paramètre:

hideFocus: true 

Ex:

$('.scroll-pane').jScrollPane(
{ 
    autoReinitialise: true, 
    hideFocus: true 
});