jQuery 툴팁 플러그인 qtip2 - 사용자 정의 스타일을 정의하는 방법은 qtip1을 좋아합니까?

Question

위대한 jquery 툴팁 플러그인 qtip을 사용하고 있습니다. 2. 아직 확인하지 않은 경우 체크 아웃하십시오. http://craigsworks.com/projects/qtip2/

누구나 미리 정의 된 툴팁 스타일을 사용하는 것과는 대조적으로 자신의 맞춤 CSS (툴팁 색상, 테두리, 배경, 반경 등)를 툴팁에 정의하는 방법을 알고 있습니까?

내가 시도하는 것 :

• 나는 그들의 스타일 가이드를 검토하지만, 자신의 스타일을 정의에 아무 것도 없었다.
• 내 자신의 툴팁 클래스를 만들어 내 qtip 버전 1 스타일 정의를 통해 변환하려면 그들에게
• 를 참조하려면 http://craigsworks.com/projects/qtip2/docs/style/
• 자신의 포럼을 시도하지만 그들은 (지금 백업) 아래로했다

하면 (실패) 이 질문은 당신을 도왔습니다. 제게 알려주세요!

Answer 1

저는 이것을 내 스타일 시트에 넣었습니다. 사용 어떤 속성, 당신은 또한 단지 jquery.qtip.css 시트 중 하나를 당기고을 편집하여 자신을 만들 수

.ui-tooltip .ui-tooltip-content, 
.ui-tooltip p, 
.ui-tooltip ul, 
.ui-tooltip li, 
.ui-tooltip, 
.qtip { 
    max-width: 280px; 
    min-width: 50px; 
    font-size: 17px; 
    line-height: 19px; 
    text-align: center; 
    border-color: #666; 
} 

...이 필요합니다. mystyle은 미리 정의 된 qTip2 스타일 중 하나와 같은 방식으로 사용하십시오.

/*! mystyle tooltip style */ 
.ui-tooltip-mystyle .ui-tooltip-titlebar, 
.ui-tooltip-mystyle .ui-tooltip-content{ 
    border-color: #303030; 
    color: #f3f3f3; 
} 
.ui-tooltip-mystyle .ui-tooltip-content{ 
    background-color: #505050; 
} 

.ui-tooltip-mystyle .ui-tooltip-titlebar{ 
    background-color: #404040; 
} 

.ui-tooltip-mystyle .ui-tooltip-icon{ 
    border-color: #444; 
} 

.ui-tooltip-mystyle .ui-tooltip-titlebar .ui-state-hover{ 
    border-color: #303030; 
} 

Answer 2

개인적으로 내 사이트에는 5 개의 테마가 있습니다. 나는 그것을하기 위해 jQuery UI's ThemeRoller을 사용하기 위해 일어난다. jQuery UI와 qTip2는 동일한 클래스 이름을 사용합니다.

내가 발견 한 유일한주의 사항은 CSS 파일을 포함시킨 순서입니다. qTip2 스타일을 재정의해야하므로 qTip2 CSS 파일 뒤에 jQuery UI CSS 파일 을 포함 시키십시오. 이런 식으로 이렇게

는

당신이 테마를 만들기 위해 당신에게 좋은 GUI를 제공뿐만 아니라, 무시되고 사용자 정의 qTip2 스타일에 대해 걱정할 필요없이 qTip2에 대한 업데이트를 풀다운 수 있습니다.