背景图像CSS歌剧问题答案

【问题标题】：Background image css opera issue背景图像CSS歌剧问题
【发布时间】：2010-09-06 19:47:42
【问题描述】：

我在歌剧中遇到了问题。我在 ul li 中有一个关于超链接的系列，并应用了背景图像。当我将鼠标悬停在链接上时，指针光标不显示。

这是一个已知的错误，代码如下

/cricket" title="Cricket" id="cricket-link" style="background-image:url(/wp-content/themes/blank2L/images/sidebar-cricket-bg.jpg);" onmouseover= "$().hoverSidebarImage('/wp-content/themes/blank2L/images/sidebar-cricket-bghover.jpg', 'cricket'); return false;" onmouseout="$().originalSidebarImage('/wp-content/themes/blank2L/images/sidebar-cricket-bg.jpg', 'cricket'); return false;">板球

#sidebar ul {
margin: 0;
padding: 0 0 27px 16px;
display: block;
float: left;
width: 180px;
}

#sidebar ul li {
background-image: url(images/left-nav-bg.jpg);
background-repeat: no-repeat;
margin: 0;
margin-bottom: 10px;
padding: 0;
display: block;
float: left;
width: 180px;
height: 40px;
list-style-type: none;
cursor:pointer !important;
}


#sidebar ul li a {
background-repeat: no-repeat;
background-position: 2px 2px;
margin: 0;
padding: 8px 8px 0 4px;
display: block;
float: left;
width: 168px;
height: 32px;
color: #ffffff;
font-family: Helvetica, Arial, sans-serif;
font-size: 18px;
font-weight: bold;
text-align: right;
cursor:pointer !important;
}

【问题讨论】：

标签： css opera

【解决方案1】：

您应该为此 id 使用悬停阶段

#sidebar ul li hover{
background-repeat: no-repeat;
background-position: 2px 2px;
margin: 0;
display: block;
float: left;
width: 168px;
height: 32px;
color: #ffffff;
font-family: Helvetica, Arial, sans-serif;
font-size: 18px;
font-weight: bold;
text-align: right;
cursor:pointer !important;
}

在你的风格中添加这个 css。

【讨论】：

遗憾的是，这并没有解决这个问题。我发现如果删除 JQuery 代码会显示光标，为什么会破坏它？非常感谢

【解决方案2】：

问题已解决，将 mouseover 和 mouseout 事件更改为返回 true；

【讨论】：

如果你对它的工作原理感到好奇，我想我可以解释一下：那些 mouseover 和 mouseout 事件返回的是事件是否应该冒泡到它们的父元素。因此，无论出于何种原因，Opera 都不会更新光标，除非事件冒泡，并且由于 jQuery 在其事件处理程序中设置为返回 false，因此从未发生冒泡。