IE7与.slidedown jQuery挣扎

时间:2014-05-14 19:26:09

标签: jquery html css

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- TemplateBeginEditable name="EditRegion12-title" -->
<title>Community Teams</title>
<!-- TemplateEndEditable -->
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type='text/javascript'>

$(document).ready(function(){
 $('.submenu').hover(function(){
    $(this).children('.submenu1').slideToggle();
}).children('.submenu1').hide();
});

</script>
<style>
#sideMenu {
    width:180px;
    position:relative;
    left:0px;
    top:0px;
}
ul, li {
    margin:0;
    padding:0;
}
#sideMenu>ul {
    position:relative;

}
#sideMenu ul ul {
    left:0;
    position:relative;
}

#sideMenu ul li {
    list-style:none;
    background: #dbe5e5;
    width:180px;
    border-bottom-style:solid;
    border-bottom-width:1px;
    border-bottom-color:#00338e;
}
#sideMenu ul li a {
    font-size:16px;
    font-family:Arial, Helvetica, sans-serif; 
    color:#00338e;
    font-weight:bold;
}
#sideMenu ul li:hover{
    background-color:#a8cdee;
}


#sideMenu ul ul li {

    width:180px;
border-bottom:none;
}
#sideMenu ul ul li a {
    width:170px;
    margin-left: 10px;
    font-weight:normal;
}
#sideMenu ul ul ul li {
    width:180px;
}
#sideMenu ul ul ul li a{
    width:160px;
    margin-left: 20px;
}
</style>
<style type="text/css">
<!--


.style5 {   font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #999999;
}
.style1 {font-family: Arial, Helvetica, sans-serif}
.style2 {font-size: 12px}
.style6 {color: #999999}
a:link {
    color: #003698;
}
a:visited {
    color: #003698; 
}
a:hover {
    color: #E06B00;
}
.active{
    background-color: #004499;
    }

#leftThird{
    float:left;
    width:180px; 
    }
#rightThird{ 
    float:right;
    width:198px;
    position:relative;
    text-align:left;    
    }

#onThird{
    position:absolute;
    top:135px;
    left:10px; 
    }
#middleThird{
    margin-left:3px;
    width:375px;
    left: 20px;
    position: relative;
    padding-left:5px;
    margin-right: 3px;  
    display:inline-block; 
    }


--> 
</style>
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
<link href="../SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css">
<link href="../benefitsnew/main.css" rel="stylesheet" type="text/css">
</head>

<body>
<div id="container">
  <div id="header">
    <div class="left"><a href = "../index.htm"><img src="../Pics/LOGO-AND-TAGLINE.gif" border = "0"/></a></div>
    <div class="right">
      <p> 1190 Devon Park Drive • Wayne, PA 19087<br />
        888-523-5545 </p>
      <form class="zoom_searchform" action="http://intranet.usli.com/Search2/search.asp" method="get">
        <input type="text" maxlength="255" class="zoom_searchbox" size="18" name="zoom_query" value="Search our Site"  onBlur="if (this.value == '') {this.value = 'Search Our Site';}"onFocus="this.value='';" />
        <input type="submit" class="button" name="search" value="Find" />
      </form>
    </div>
  </div>
  <div id="menu">
    <ul id="oldtopmenu">
      <li><a href="../5CommunityGoals/5CommunityGoals.htm">Five Community<br />
        Goals</a></li>
      <li><a href="../UnderwritingTools/UnderwritingTools.htm">Underwriting<br />
        Tools</a></li>
      <li><a href="../PersonalDevelopment/pdc2.htm">Personal<br />
        Development Team</a></li> 
      <li><a href="../Company Story/CompanyStory.htm">Company<br />
        Story</a></li>
      <li><a href="../LeadershipwithHeart/LeadershipwithHeart.htm">Leadership<br />
        with Heart</a></li>
      <li><a href="../BusinessCodeEthics/BusinessCodeEthics.htm">Business Code<br />
        &amp; Ethics</a></li>
      <li><a href="../BranchOffices/Branch-Offices.html">Branch<br />
        Offices</a></li>
      <li ><a class = "active" href="../CommunityTeams/CommunityTeams_landing_page.html">Community<br />
        Teams</a></li>
      <li><a href="../Forms/ServiceRequestForms.htm" style="padding:5px 16px;">Service<br />
        Request Forms</a></li>
    </ul>
    <ul id="oldbotmenu">
      <li><a href="../index.htm">Home</a></li>
      <li><a href="http://www.usli.com" target="_blank">Public Website</a></li>
      <li class="double-line"><a href="../EmergencyResponse/EmergencyResponse.htm">Emergency Response /<br />
        Staffing Plan</a></li>
      <li class="double-line"><a href="../CareerOpportunities/CareerOpportunities.htm">Career<br />
        Opportunities</a></li>
      <li class="double-line"><a href="../PhoneList.htm">Community Mtg.<br />
        Presentation</a></li>
      <li class="double-line"><a href="../StaffLocator/StaffLocator_Pictures.htm">Phone List /<br />
        People Search</a></li>
      <li><a href="../Reflection/InLovingMemory.htm">Remembrance</a></li>
      <li><a href="../ResourcesPages/Resources.htm" style="padding:0 17px;">Resources</a></li>
    </ul>
  </div>

<div id="content">
<div id="leftThird" > 
<div id = "sideMenu">
<ul>
        <li><a href="../CommunityTeams/CommunityTeams_landing_page.html">Community Teams</a></li>
        <li><a href="../CARE2/CARE2-home.htm">CARE<sup>2</sup> </a></li>
        <li><a onclick= "window.open('../PersonalDevelopment/pdfs/CARE2Module12.pdf','_blank');">This Year's Module</a></li>
        <li class="submenu" ><a href="../CARE2/CARE2-home.htm">Care<sup>2</sup> Fund at USLI</a>
            <ul class="submenu1" >
                <li class="submenu"><a href="../CARE2/CAre2Fund.htm">Fund Guidlines</a></li>

                <li ><a href="../CARE2/fundform.pdf" target = "_blank">Fund form</a>


                </li>
                <li><a href="../CARE2/FundThanks.htm">Fund Thank You's</a></li>
            </ul>
       </li>
       <li><a href="../CARE2/CARE2Force.htm">Care<sup>2</sup> Team</a></li>
       <li><a href="http://intranet.usli.com/CARE2/Care2WearGearEntrance.html" target="_blank">Care<sup>2</sup> Wear Gear</a></li>
    </ul>

</div>
  <!--<ul id="MenuBar1" class="MenuBarVertical">
<li><a href="../CommunityTeams/CommunityTeams_landing_page.html"><strong>Community Teams</strong></a></li>
<li><a href="../CARE2/CARE2-home.htm"><strong>CARE<sup>2</sup></strong></a></li>
<li><a onclick= "window.open('../PersonalDevelopment/pdfs/CARE2Module12.pdf','_blank');"><strong>This Year's Module</strong></a></li>
<li><a href="../CARE2/CARE2-home.htm" class="MenuBarItemSubmenu"><strong>CARE<sup>2</sup> Fund at USLI</strong></a>
  <ul>
<li><a href="../CARE2/CAre2Fund.htm">Fund Guidelines </a></li>
<li><a href="../CARE2/fundform.pdf" target = "_blank">Fund Form</a></li> 
<li><a href="../CARE2/FundThanks.htm">Fund Thank You's</a></li>
  </ul>
</li>
    <li><a href="../CARE2/CARE2Force.htm"><strong>Care<sup>2</sup> Team</strong></a></li>
    <li><a href="http://intranet.usli.com/CARE2/Care2WearGearEntrance.html" target="_blank"><strong>Care<sup>2</sup> Wear Gear</strong></a></li>
  </ul>
  <img src="../Pics/bottom.gif" width="182" height="144">-->
</div>

<div id="rightThird">
  <!-- TemplateBeginEditable name="EditRegion2" -->Image<!-- TemplateEndEditable -->

    <div id="onThird" ><!-- TemplateBeginEditable name="EditRegion3" -->EditRegion3<!-- TemplateEndEditable --></div>

</div>
<div id="middleThird" ><!-- TemplateBeginEditable name="EditRegion1" -->EditRegion<!-- TemplateEndEditable --></div>


</div>
</div>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
  <script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-8410742-9");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html>

这是我的网页的HTML代码,它在IE8 +和Chrome中运行良好。当你在USLI的Care2基金上徘徊时,它将使用滑动调用来下滑菜单。然后你看到列表项,然后悬停颜色覆盖整个ul。我觉得我忘记了IE7无法识别的东西。如果你能看到任何疯狂的事情,请告诉我。再说这只是一个IE7问题!!

谢谢, 基里耶

0 个答案:

没有答案