要解决“按钮悬停效果正常，而菜单按钮悬停效果不正常”的问题，可以尝试以下代码示例解决方法：

HTML代码：

普通按钮
菜单按钮


  

    
菜单项1
    
菜单项2
    
菜单项3
  

CSS代码：

.normal-button:hover {
  background-color: yellow;
}

.menu-button:hover {
  background-color: red;
}

.menu {
  display: none;
}

.menu:hover {
  display: block;
}

JavaScript代码：

document.querySelector('.menu-button').addEventListener('mouseover', function() {
  document.querySelector('.menu').style.display = 'block';
});

document.querySelector('.menu-button').addEventListener('mouseout', function() {
  document.querySelector('.menu').style.display = 'none';
});

上述代码首先定义了两种不同按钮的CSS样式，其中.normal-button:hover会在鼠标悬停时改变背景颜色为黄色，.menu-button:hover会改变背景颜色为红色。

接着，使用CSS将菜单隐藏起来（display: none;）。当鼠标悬停在菜单按钮上时，通过JavaScript将菜单显示出来（display: block;）。当鼠标离开菜单按钮时，将菜单隐藏（display: none;）。

这样，按钮的悬停效果将正常显示，同时菜单按钮的悬停效果也将正常显示。