탐색 jquery 플러그인이 예상대로 작동하지 않습니다.

Question

jQuery 탐색 작업을하려고하지만 원하는대로 동작하지 않습니다. 그것은 kwicks이라는 플러그인입니다. nav가 슬라이드 아웃 할 때 텍스트가 있어야합니다.

나는 HTML and CSS in a jsFiddle을 넣을 것이고, test page of the site의 링크를 제공 할 것이므로 코딩을 살펴볼 수 있습니다. 사전에

감사

HTML

<ul id="kwickslist" class='kwicks kwicks-horizontal'> 
    <li id='panel-1'> 
     <div class="kwicks_inner_inner"> 
      <div class="navimage"><a id="index2" href="index.html">test</a></div> 
      <div class="smallText"> <p>Cyberia Design.</p></div> 
     </div> 
    </li> 
    <li id='panel-2'> 
     <div class="kwicks_inner"> 
      <div class="navimage"><a id="about2" href="about.html">test</a></div> 
      <div class="smallText">About.</div> 
     </div> 
    </li> 
    <li id='panel-3'> 
     <div class="kwicks_inner"> 
      <div class="navimage"><a id="work2" href="work.html">test</a></div> 
      <div class="smallText">Work.</div> 
     </div> 
    </li> 
    <li id='panel-4'> 
     <div class="kwicks_inner"> 
      <div class="navimage"><a id="contact2" href="contact.html">test</a></div> 
      <div class="smallText">Contact.</div> 
     </div> 
    </li> 
</ul> 

CSS

.kwicks { 
    display: block; 
    list-style-type: none; 
    list-style: none; 
    position: relative; 
    margin: 0; 
    padding: 0; 
} 
.kwicks > * { 
    display: block; 
    overflow: hidden; 
    padding: 0; 
    margin: 0; 
} 
.kwicks.kwicks-processed > * { 
    margin: 0; 
    position: absolute; 
} 
.kwicks-horizontal > * { 
    float: left; 
} 
.kwicks-horizontal > :first-child { 
    margin-left: 0; 
} 
.kwicks-vertical > :first-child { 
    margin-top: 0; 
} 
.kwicks { 
    width: 515px; 
    height: 100px; 
} 
.kwicks > li { 
    width: 50px; 
    height: 50px; 
    /* overridden by kwicks but good for when JavaScript is disabled */ 
    margin-left: 5px; 
    float: left; 
} 

#panel-1 { 
    background-color: #141414; 
} 

#panel-2 { 
    background-color: #141414; 
} 
#panel-3 { background-color: #141414; } 
#panel-4 { background-color: #141414; } 

#kwickslist li { 
    float: left; 
    width: 75px; 
    height: 50px; 
} 
#kwickslist .kwicks_inner { 
    width: 200px; 
} 
#kwickslist .navimage { 
    height: 50px; 
    float: left; 
} 
#kwickslist .smallText { 
    display: none; 
    text-align: center; 
    width: 50px; 
    color: white; 
    font-size: 10px; 
    margin-top: 5px; 
    float: right; 
} 
#kwickslist li.active.smallText { 
    display: block; 
} 

Answer 1

그들이 이상 공중 선회하는 경우 '0'으로 다시 'A'태그에 텍스트 들여 쓰기 속성을 설정하십시오 현재는 마우스를 올리면 여전히 '-9999px'로 설정됩니다.

아마도 흰색과 비슷한 색상으로 설정해야 할 것입니다.

또한 CSS를이 추가 :

ul#kwickslist li:hover .kwicks_inner_inner .smallText { 
    display:block; 
}