如何移除ExtJS Tooltip箭头？ExtJS3面板提示框三角箭头去除

嘿，我刚好对ExtJS 3的Tooltip组件熟得很，要去掉那个烦人的三角锚点箭头，有两个靠谱的方法，你可以按需选择：

方法一：直接通过组件配置禁用锚点 #

这是最直接的方式——把你代码里的anchor: 'bottom'改成anchor: false就行。ExtJS 3的Tooltip组件会自动识别这个配置，直接隐藏锚点箭头。

修改后的完整代码片段：

var tooltipHide = new Ext.ToolTip({ 
    anchor: false, // 禁用锚点，箭头自然消失
    target: 'summaryButton', 
    anchorOffset: 0, // 这个配置其实可以删掉了，因为锚点已经禁用
    width: 300, 
    mouseOffset: [0, 25], 
    autoHide: false, 
    closable: false, 
    autoScroll: true, 
    html: '<div style="overflow:hidden;height:480px;width:300px;">' + mycaseSummaryData + '</div>', 
}); 

小贴士：既然锚点禁用了，anchorOffset这个配置其实没用了，删掉也不影响功能~

方法二：用CSS全局隐藏箭头 #

如果你的项目里有多个Tooltip都需要去掉箭头，或者不想修改组件配置，直接写一段CSS就能全局生效：

.x-tip-anchor {
    display: none !important;
}

ExtJS 3的Tooltip锚点箭头对应的CSS类就是.x-tip-anchor，把它设为display: none就能彻底隐藏，!important是为了确保覆盖组件默认的样式优先级。

两种方法都能解决问题，选哪个看你具体场景：单个Tooltip改配置，多个Tooltip用CSS更高效~

内容的提问来源于stack exchange，提问作者cheeku