Question

我们有一个代码，当您单击该图标时，会出现一个div。我们希望在将鼠标悬停在图标上时显示，而不是单击。我们怎么做呢？

此代码位于我的Wordpress主题的页脚部分。它需要改变才能像我想要的那样工作。代码是这样的：

＆＃13;

        <script type="text/javascript">
			$(document).ready(function(){
				var searchi = 0;
				$("#social-medias").click(function(){
					$("#medias-icons").slideToggle("fast");
                    if ( searchi == 0 ){
                        $(this).addClass("searchAct1");
                        searchi = 1; 
                    }else{
                        $(this).removeClass("searchAct1");
                        searchi = 0;
                    }
				});
			});
		</script>

＆＃13;

Answer 1

而不是.click(function() { //code here; });使用.mouseover(function() { //code here; });

然后要将其撤消，请使用.mouseout(function() { //reverse code here; });

Answer 2

我看到这些元素是嵌套的，所以你只能使用样式

来实现

.a{
color:blue;
}
.a .b{
    color:red;
}
.a:hover .b{
    color:green;

HTML：

<div class="a">
    a
    <div class="b">
        b
    </div>
</div>

在此示例之后，当光标位于其父级（悬停）上时，您可以覆盖嵌套类行为（例如display：none / block）

关于点击或悬停功能

2 个答案: