Response title
This is preview!
my jquery side panel hates me on js bin and it wont toggle
in Using jQuery
•
9 years ago
i made my code and checked it twice the indentation is perfect and nice, BUT
when you hover over the "contact here" .contactslide it fades to opaque and everything but it wont pull down!!
can u help me??
this is the js bin link:
HTML:
<!DOCTYPE html>
<html>
<head>
<title>graIV</title>
</head>
<body>
<body background=
<div class="contactpanel">
<p>
</p>
<p>
<p>p#520.604.6906</p>
<p>frankgoswald@gmail.com</p>
</div>
<p class="contactslide">
<a href="#" class="contactpull-me">contact here</a>
</p>
</body>
</html>
CSS:
body {
margin:0 auto;
padding:0;
width:200px;
text-align:center;
}
a:hover{
opacity:0.3
}
.contactpanel {
background: white;
background-size:90% 90%;
height:300px;
display:none;
font-family:courier;
}
.contactpanel p{
text-align:center;
}
.contactslide {
margin:0;
padding:0;
}
.contactpull-me {
display:block;
position:relative;
right:-25px;
width:150px;
height:20px;
font-family:courier;
font-size:14px;
color:black;
background:white;
text-decoration:none;
-moz-border-bottom-left-radius:5px;
-moz-border-bottom-right-radius:5px;
border-bottom-left-radius:5px;
border-bottom-right-radius:5px;
}
.contactpull-me p {
text-align:center;
}
JavaScript:
$(document).ready(function(){
$('.contactpull-me').click(function(){
$('.contactpanel').slideToggle('slow');
});
});
1