jQuery slider button not working

programming web dev
1

Here is the example: neuegraphics.com/londes

I want the button to expand the div form and close the div form if the form is open. Right now it works once but the second time through it freaks out.

Also check this out in Safari because I believe the css is not correct since the button does not expand along with the divform.

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=UTF-8” />
<title>Untitled Document</title>
<link href=“css/contactForm.css” rel=“stylesheet” type=“text/css” />

<script type=“text/javascript” src=“js/jsMin.js”></script>
</head>
<body>
<div id=“wrapper”>
<div id=“openForm”>

&lt;div id="container"&gt;
    &lt;h1 class="title"&gt;Contact Us&lt;/h1&gt;
  &lt;div id="form"&gt;
    &lt;form action="" method="post" name="contact-us"&gt;
        &lt;div id="row"&gt;
        &lt;div class="celltitle"&gt;Name&lt;/div&gt;
        &lt;div class="cell"&gt;&lt;input name="" type="text" size="42" /&gt;&lt;/div&gt;	
    &lt;/form&gt;
  &lt;/div&gt;
&lt;/div&gt;
&lt;a&gt;&lt;div id="openBtn"&gt; &lt;/div&gt;&lt;/a&gt;

</div>
</div>

<script>
$(document).ready(function(){
$x = 1;
$y = 0;

if($x &gt; $y) {
	
	$('#openBtn').click(function(){
		$('#openForm').animate({width:'350px'}, 500);
		$y = 3;
		$x +=1;
		//this method increases the height to 393px	
		
		if ($x &gt; 1) {
			$(this).click(function(){
			$('#openForm').animate({width:'10px'}, 500);	
						
		});
	}
	
});

}
});

</script>

</body>
</html>

@charset “UTF-8”;
/* CSS Document */

body{
font-family:Arial, Helvetica, sans-serif;
color:#fff;
}
h1{
color:#afffa2;
}
#wrapper{
width:100%;
height:100%;
min-height:850px;
background-color:#ccc;
}
#openForm{
width:10px;
height:850px;
float:right;
overflow:hidden;
}
#container{
width:350px;
height:850px;
background-image:url(…/images/ContactBKG.jpg);
background-repeat:no-repeat;
float:left;
}
#openBtn{
position:fixed;
width:43px;
height:75px;
background-image:url(…/images/contactTAB.png);
top:426px;
margin-left:-43px;
float:left;
cursor:pointer;
}
.title{
margin-left:25px;
}
#form{
margin-left:25px;
width:300px;
height:100%;
}

.shaddow{
box-shadow: 0px 7px 10px #000;
}
input {
height:50px;
border-radius:15px;
moz-border-radius:15px;
}
#row{
width:300px;
height:75px;
}
.cell {
clear:both;
}
.celltitle {
float:left;
color:fff;
font-size:18px;
}