无法创建事件悬停

时间:2018-09-23 15:33:25

标签: javascript jquery css

我想在这段代码中为元“ a”创建一个HOVER事件,以更改其背景颜色,但是它似乎不起作用,我真的不知道我在想什么,这里是:

document.addEventListener("DOMContentLoaded", function() {
		$("#admin_symbol").hover(function(){
			$("#header_div2").css("background-color","black");
		},
		function(){
			$("#header_div2").css("background-color","#222222");	
		}
		);
				
		$("#sub_menu_admin").hide();
		$("#admin_symbol").click(function(){			
			$("#sub_menu_admin").slideToggle();	
		})
		
        <!-- i create it here -->
		$(".class_admin").hover(function(){
			$(this).css("background-color","#cccccc");
		}
		,
		function(){
			$(this).css("background-color","white");
		});
	});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="header">
    	<div id="header_div1">
        	Quảng trị hệ thống
        </div>
        <div id="header_div2">
        	<ul>
            	<li id="admin_symbol"><span id="admin_welcome">&nbspXin chào: Admin</span></li>
                <ul id="sub_menu_admin">
                	<li  id ="admin_prolife"><a class="class_admin" id ="admin_a1" href="#"><img id="admin_prolife_symbol" src="https://cdn3.iconfinder.com/data/icons/user-with-laptop/100/user-laptop-512.png">&nbsp Prolife</a></li>
                    <li  id="admin_changepw"><a class="class_admin" id ="admin_a2" href="#"><img id="admin_changepw_symbol" src="http://simpleicon.com/wp-content/uploads/setting2.png"> &nbsp Đổi mật khẩu</a></li>
                    <li  id="admin_logout"><a class="class_admin" id ="admin_a3" href="#"><img id="admin_logout_symbol" src="https://cdn4.iconfinder.com/data/icons/basic-ui-elements/700/012_power-512.png">&nbsp Log out</a></li>
                </ul>
            </ul>
        </div>
    </div>

以防万一:

+我的完整项目:https://jsfiddle.net/HiepNguyen/do7nsyr5/93/

我确实尝试使用CSS创建一个悬停事件,但是没有运气。 我感谢所有帮助。

[更新] :我发现当我在jsfiddle上使用我的代码时,它运行良好,但是当我在本地运行时,子菜单项不会像我一样更改其背景颜色。想要,仍然不知道为什么。

0 个答案:

没有答案