相关疑难解决方法(0)

我想知道是否有可能以某种方式用JS触发CSS HOVER效果,而不必使用额外的类......

这是我想做的一个例子:http: //jsfiddle.net/pXbMZ/2/

我尝试过激活效果,mouseenter()但这不会触发CSS悬停效果.

PS:我已经创建了一个帮助用户使用在线CMS的功能.帮助功能向您展示如何通过移动图像来显示如何使用东西.虚拟光标可以点击东西,显示元素等.但我希望这个虚拟光标能够触发:CSS中设置的悬停效果.

当用户将鼠标悬停在元素上时,将触发CSS的"悬停状态":

<style>
.element{

}
.element:hover{
    background-color:red;
}
</style>

如何使用Javascript将元素设置为"悬停状态"？

可能吗？

我有一些Javascript在悬停时显示一个元素.我想设置此元素的样式,因此需要使用Chrome开发工具在浏览器中触发悬停状态.

使用CSS很容易,您可以在Dev Tools中设置元素的状态.使用Javascript执行此操作的最佳方法是什么？

代码示例:

$('#menu').hover(
    function() {
        console.log('test');
        $('#dropdown').show();
    },

    function() {
        $('#dropdown').hide();
    }
);

我有<div class="animate">和在css:

div.animate:hover{
//do stuff
}

但是也想通过javascript调用它.

可能吗？

我正在使用 RMWC ( https://github.com/jamesmfriedman/rmwc )在网络上使用 ReactJS 和 Google 的 Material 组件。我有一个父组件，其中包含一个图标和一个文本。该图标具有 Material Design 涟漪效果，这意味着当我将其悬停或单击时，会触发动画。

我现在想在我悬停或单击下面的文本时触发相同的效果。

这是组件：

export class Subject extends Component {
constructor(props) {
    super(props)
}

triggerRippleHover() {
    console.log("hovered");
    // HERE
  }

renderSubjectIcon(Icon) {
    return (
        <Icon className="subject-icon" />
    )
  }

render() {
    return (
        <div className="subject-container">
            <Ripple unbounded>
                <div className="subject-icon-container">
                    {this.renderSubjectIcon(this.props.icon)}
                </div>
            </Ripple>
            <span onMouseEnter={this.triggerRippleHover}>{this.props.name}</span>
        </div>
    )
}

基本上，我只想“扩展”触发图标行为的区域（如果有任何意义）。

我一直在广泛搜索，但一直无法找到合适的答案。

非常感谢你的帮助。