可以使用CSS属性"pointer-events:none;"来解决此问题。该属性将禁用元素上的所有交互,包括鼠标事件和滚动,使用户能够滚动页面。例如,在Blockly的toolbox中添加以下样式:
.blocklyToolboxDiv {
pointer-events: none;
}
这将禁用工具栏上所有鼠标事件,允许页面滚动。
注意:如果您需要使元素仍能够响应鼠标事件,则可以使用JavaScript在鼠标移入和移出事件上启用和禁用此属性。以下是示例代码:
var toolbox = document.getElementById('toolbox');
toolbox.addEventListener('mouseover', function() {
this.style.pointerEvents = 'auto';
});
toolbox.addEventListener('mouseout', function() {
this.style.pointerEvents = 'none';
});
这将在鼠标悬停在工具栏上时允许交互,并在鼠标移开后禁用它。
下一篇:blockly与深度学习