http://www.tweeturrep.com.s3-website-us-east-1.amazonaws.com/index.html
出于某种原因,当我将样式添加到顶部的导航栏时,链接开始有时只能工作。例如,您无法点击输入您的邮政编码,直到您打开并关闭投票模式。此外,如果您将鼠标悬停在视频链接上,它将更改为指针,然后返回,您无法点击。 idk什么会继续,但我认为它与引导程序的东西有关
<div class="content" position="absolute">
<table position="absolute">
<tr>
<td class="navOPtion">
<img class ="navImage" src="navicon.png">
</td>
<td class="navOPtion" id="hideNav5">
<a style="color:white" href="index.html" id="home">home</a>
</td>
<td class="navOPtion" id="hideNav1">
<a style="color:white" href="videos.html" id="videos" >videos</a>
</td>
<td class="navOPtion" id="hideNav">
<a style="color:white" href="resume.html" target="blank" id="resume">resume</a>
</td>
<td class="navOPtion" id="hideNav2">
<a style="color:white" data-toggle="modal" data-target="#myModal1">
about
</a>
</td>
<td class="navOPtion" id="hideNav3">
<a style="color:white" href="blog.html">blog</a>
</td>
<td class="navOPtion" id="hideNav4">
<a style="color:white" data-toggle="modal" data-target="#myModal">
votes
</a>
</td>
</tr>
<tr>
<td class="title" colspan="7">
tweetUrRep
</td>
</tr>
<tr>
<td class="search" colspan="7">
<form id="find_overlords" align="center">
<form action="" id="find_overlords" type="post">
<input type="text" id="user_Zip" name="zip" placeholder="Zip code" style="width:225px; height:75px;
font-size:20pt" class="input33"></input>
<input type="image" src="search-13-128.png" name="saveForm" class="smallSearchIcon" id="saveForm" >
<br>
<input type="image" src="search-13-128.png" name="saveForm" class="searchIcon" id="saveForm" >
</form>
</td>
</tr>
</table>
css:
table{
position:static;
margin:auto auto auto auto;
color:white;
width:100%;
}
.navImage {
height: 50px;
width: 75px;
cursor: pointer;
}
.navOPtion{
width:10%;
}
#hideNav{
display:none;
font-size: 30px;
}
#hideNav2{
display:none;
font-size: 30px;
}
#hideNav3{
display:none;
font-size: 30px;
}
#hideNav4{
display:none;
font-size: 30px;
color:white;
}
#hideNav5{
display:none;
font-size: 30px;
color:white;
}
#hideNav1{
display:none;
font-size: 30px;
color:white;
}
显示hideNavs的javascript:
$(document).ready(function(){
$('.navImage').click(function(){
$('#hideNav').slideToggle('fast');
$('#hideNav1').slideToggle('fast');
$('#hideNav2').slideToggle('fast');
$('#hideNav3').slideToggle('fast');
$('#hideNav4').slideToggle('fast');
$('#hideNav5').slideToggle('fast');
});
});