jQueryUI 슬라이더 핸들 테두리를 제거하는 방법

Question

배경 이미지를 성공적으로 변경했습니다. 핸들을 클릭 할 때마다 나타나는 노란색 테두리 만 성공적으로 변경되었습니다. 이 테두리는 내가 페이지의 다른 곳을 클릭 할 때까지 남아 있습니다. 또한 핸들이 움직일 때마다이 경계선이 깜박입니다. Someone had the same problem befor 아무도 대답하지 않았습니다.

어떻게이 경계를 제거 할 수 있습니까?

이

내 페이지 (제거 임시 링크)

Answer 1

.ui-slider a {outline:none;} /* a img { outline:none } for reference 

인라인 이미지를 하이퍼 링크로 사용하는 경우 일부 브라우저의 기본값이라고 생각합니다.

크롬과 사파리와 FF는 이런 저런 형태를 보여 주었다 : 사파리가 파란색으로 보여 FF는

IE6

가, IE7이 아무것도 없었다 ... 점선 테두리로 보여 주었다.

** 편집 **
오히려 윤곽을 제거하는 것보다, 당신은 당신의 디자인에 적합하게 스타일링 고려할 수 있습니다. 이것은 슬라이더가/화살표 키 친화적 인 경우 핸들이 현재 집중되어 있다는 것을 키보드 사용자에게 알려줍니다.

.ui-slider a:focus { outline:1px dotted gray } 

Answer 2

당신은

.ui-widget-content .ui-state-focus,

그것은 또한 이미지에 적용되지 않는 문서의 CSS에 쉼표를 놓치고 있지만, 태그입니다 그래서

img { border:none; }

이 작동하지 않아야합니다.

Answer 3

이 주어진 답보다 더/더 있는지 확실하지 않습니다,하지만 내가 말할 수있는 내가 무슨 생각에서 나는이 스레드에 걸쳐 오기 전에 난 항상 이런 짓을했는지 방법을 선호하고, 내가 것이라고 생각 다른 사람과 공유하면 나중에 참조 할 수 있습니다. 나는 좋은 결과를 얻었다. 나는이 특별히 더 정확하게 실제 핸들을 대상으로 생각 :

.ui-slider .ui-slider-handle:focus { outline: none; }