0

我有一个 125x80 的翻转图像。以下代码是简单的 html&css 并且工作正常，但是当我尝试将 #questions div 集成到 JQuery 工具选项卡窗格中时，该按钮永远不会出现。我想知道我做错了什么。

<html>
<head>
<style>

#questions a:link{
height: 40px;
width: 125px;
display: block; 
background: url(../images/btn-questions.png) no-repeat left top;
}

#questions a:hover{  background-position: left bottom;  }   

</style>
</head>

<body>

<div id="questions"> <a href="#"></a> </div>

</body>
</html>

那是有效的。然后我尝试将它集成到 JQuery 工具选项卡窗格中，方法如下：

<div class="panes"> 

<div>
This is the first tab. This text appears inside the pane
<img src="../This image works too.png" />

<div id="questions">
    <a href="#">WHY THIS ROLLOVER BUTTON DOESN'T APPEAR INSIDE THE PANE?</a>
</div>

</div>  
</div>

提前致谢！

4

1 回答 1

0

好的，最后我放弃了 JQuery 工具选项卡。这对我来说似乎太复杂了。现在我正在使用来自http://www.sohtanaka.com/web-design/examples/tabs/的标签，并且翻转图像工作正常。另外，我必须通过以下方式更改 CSS：

#questions {
position: absolute;
left:500px;
top:75px;
width:125px; 
height:40px;        
overflow:hidden; /* IE needed */     
}

#questions a:hover img
{ margin-top:-40px }

我通过以下方式更改了 div：

<div id="questions">  
    <a href="#"><img  src="../images/btn-questions.png" ></a>
</div>

我更喜欢这个标签。此外，您不需要 JQuery 工具所需的任何选项卡图像。更好、更干净、更容易。希望这个解决方案可以帮助任何有同样问题的人。

于 2011-04-07T23:59:20.057 回答