2012-06-14 7 views
0

3 개의 탭에 텍스트 정보가 포함 된 jquery 이미지 슬라이더를 사용하고 있습니다. 각 탭마다 다른 배경 이미지가 있고 다른 이미지로 변경하고 싶습니다. 탭에 가져 가거나 활성 효과가 있습니다. IE (IE7,8,9에서 테스트했습니다)를 제외한 모든 브라우저에서 잘 작동합니다. IE에서 어떤 탭이 활성화되면 그 배경 이미지는 tab3 (마지막 탭)의 활성 배경 이미지로 바뀝니다. 추가 정보가 필요하면 알려주십시오. 당신이 닫는 누락처럼jquery 이미지 슬라이더 탐색 탭 IE에서 배경 이미지가 변경되지 않습니다.

<div id="featured_slide"> 
    <div id="featured_wrap"> 
    <ul id="featured_tabs"> 
    <li class="tb1"><a href="#fc1">A<br /> 
     <span>test message1.</span></a></li> 
    <li class="tb2"><a href="#fc2">B<br /> 
     <span>test message2.</span></a></li> 
    <li class="tb3"><a href="#fc3">C<br /> 
     <span>test message3</span></a></li>   
    </ul> 
    <div id="featured_content"> 
    <div class="featured_box" id="fc1"><img src="images/Main1.png" alt="" /> 

    </div> 
    <div class="featured_box" id="fc2"><img src="images/Main2.png" alt="" /> 

    </div> 
    <div class="featured_box" id="fc3"><img src="images/Main3.png" alt="" /> 

    </div> 

    </div> 
</div> 

<style> 
#featured_slide ul#featured_tabs li.last 
{ 
     border-bottom:none; 
} 

#featured_slide ul#featured_tabs li.tb1 
{ 
    background:url("../images/Slider1.png") top right no-repeat transparent; 
} 
#featured_slide ul#featured_tabs li.tb2 
{ 
    background:url("../images/Slider2.png") top right no-repeat transparent; 
} 
#featured_slide ul#featured_tabs li.tb3 
{ 
    background:url("../images/Slider3.png") top right no-repeat transparent; 
} 


#featured_slide ul#featured_tabs li.tb1 a:hover 
{ 
    background:url("../images/Slider1Active.png") top right no-repeat transparent; 
} 
#featured_slide ul#featured_tabs li.tb2 a:hover 
{ 
    background:url("../images/Slider2Active.png") top right no-repeat transparent; 
} 
#featured_slide ul#featured_tabs li.tb3 a:hover 
{ 
    background:url("../images/Slider3Active.png") top right no-repeat transparent; 
} 


#featured_slide ul#featured_tabs li.tb1.ui-tabs-selected a 
{ 
    background:url("../images/Slider1Active.png") top right no-repeat transparent; 
} 
#featured_slide ul#featured_tabs li.tb2.ui-tabs-selected a 
{ 
    background:url("../images/Slider2Active.png") top right no-repeat transparent; 
} 
#featured_slide ul#featured_tabs li.tb3.ui-tabs-selected a 
{ 
background:url("../images/Slider3Active.png") top right no-repeat transparent; 
} 

</style> 

답변

0

보이는 : 다음은 내 HTML 코드와 CSS입니다. html 하단에 다른 닫는 div를 추가하고 문제가 해결되는지 확인하십시오.

+0

작동하지 않았습니다. – Gaurav

관련 문제