jQuery .hover()无效

时间:2015-08-23 12:29:30

标签: javascript jquery html css

我遇到的问题就像标题所说的那样。它适用于除了一个之外的所有div!

 $(".complete-wrapper-1").hide();
var panelHH = $(".file-select-wrapper").innerHeight;
$(".files-button").hover(function(){
    $(".complete-wrapper-1").show();
});

$(".complete-wrapper-1").hover(function(){
    $(".file-select-wrapper").stop(1).show().height(0).animate({height: panelHH},500);
}, function(){
    $(".file-select-wrapper").stop(1).animate({height: 0},500, function(){
        $(this).hide();  
    });
});

编辑:html。



<!DOCTYPE html>
<html>
	<head>
		<link type="text/css" rel = "stylesheet" href="osframe.css">
		<link type="text/css" rel = "stylesheet" href="appframe.class.css">
		<link type="text/css" rel = "stylesheet" href="icons.css">
		<link type="text/css" rel = "stylesheet" href="start-menu.css">
		<link type="text/css" rel = "stylesheet" href="menus.css">
		<script type="text/javascript" src="jquery.js"></script>
		<script type="text/javascript" src="jquery-ui.js"></script>
		<script type="text/javascript" src="anos_api_buttons.js"></script>
		<script type="text/javascript" src="applications.js"></script>
		<script type="text/javascript" src="game_api.js"></script>
		<script type="text/javascript" src="ApplicationLoader.js"></script>
        <script type="text/javascript" src="MultiPane.js"></script>
        <script type="text/javascript" src="front-end.js"></script>
        <script type="text/javascript" src="search.js"></script>
        <script type="text/javascript" src="jquery.easing.js"></script>
        <script type="text/javascript" src="jqueryFileTree.js"></script>
		<noscript>You browser does not support javascript of it may disabled.</noscript>
	</head>
    
    
	<body oncontextmenu="return false;">
		<div id = "frameAsWhole">
			<div class ="item-frame">
                <div class = "box1">
				    <div class = "infoPane">
				    </div>
				
                    <div class = "area-frame">
                        <div class = "desktop-box">
                            <div class = 'info-dropdown'></div>
                            <table class = "table">
                            </table>
                            <div class ="search-r-wrapper">
                                <div class = "search-part">
                                    Search
                                </div>
                                <div class = "recent-part">
                                    Recent Apps
                                </div>
                                <div class = "search-results">

                                </div>
                                <div class = "recent-results">

                                </div>
                                <div class = "downard-arrow"></div>
                            </div>
                            <div class = "file-select-wrapper">
                                <div class = "file-select">
                                    <div class = "folder-select-wrapper">
                                        <div class = "desktop-folder" class = "folder-icon fisize">
                                            <div class="folder-text-side folder-text-side-1">Desktop</div>
                                        </div>
                                    </div>
                                    <div class = "folder-select-wrapper">
                                        <div class = "documents-folder" class = "folder-icon fisize">
                                            <div class="folder-text-side folder-text-side-2">Documents</div>
                                        </div>
                                    </div>
                                   <div class = "folder-select-wrapper">
                                        <div class = "images-folder" class = "folder-icon fisize">
                                            <div class="folder-text-side folder-text-side-3">Images/Videos</div>
                                        </div>
                                    </div>
                                   <div class = "folder-select-wrapper">
                                        <div class = "music-folder" class = "folder-icon fisize">
                                            <div class="folder-text-side folder-text-side-4">Music</div>
                                        </div>
                                    </div>
                                    <div class = "folder-select-wrapper">
                                        <div class = "applications-folder" class = "folder-icon fisize">
                                            
                                        </div>
                                    </div>
                                </div>
                                <div class = "downard-arrow"></div>
                            </div>
                            <div class = "complete-wrapper-1"></div>
                        </div>
                    </div>
                    <div class = "taskbar-wrap">
                        <div class = "taskbar">
                            <div class = "files-button">
                                
                            </div>
                            <table>
                                <tr class = "taskbar-items">

                                </tr>
                            </table>
                            <div class = "search-wrapper">
                                <input type="textarea" class ="search-bar">
                                </input>
                                <div class = "computer-search">
                                </div>
                            </div>
                        </div>
                    </div>
				</div>
			</div>
		</div>
	</body>
</html>
&#13;
&#13;
&#13; CSS不包括在内 第1行到第5行有效,但在此之后没有任何作用。如果.complete-wrapper-1不是我想要的div .hover();继续努力。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

代码几乎可以工作但不是100%。问题是在我的css代码中使用z-index并且阻止了鼠标中的元素,因此它没有任何东西可以运行该事件。有点像我有X射线谷歌,并试图用我的手螃蟹某人的心脏,它显然是行不通的。