Response title
This is preview!
Help with replaceWith() and slideUp()
in Using jQuery
•
11 years ago
I'm trying to get it so that when I click on a menu item, the old content in the content div slides up, and then the new content slides up to replace it, and I can't get it to work. I've only included code for the first menu item as an example. What am I doing wrong? Any help would be much appreciated!! Thanks!
<head>
<link href="main.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<title>some title</title>
<script>
$('li.first').click(function(){
var $content=$("#content");
$content.slideUp(function() {
$content.html('');
$content.html('home stuff goes here').slideUp();
)})}
</script>
</head>
<body>
<div id="menu">
<ul>
<li class="first"><a>HOME</a></li>
<li class="second"><a>ABOUT</a></li>
<li class="third"><a>GALLERY</a></li>
<li class="fourth"><a>CONTACT</a></li>
</ul>
</div>
<div id="content">
</div>
</body>
</html>
<head>
<link href="main.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<title>some title</title>
<script>
$('li.first').click(function(){
var $content=$("#content");
$content.slideUp(function() {
$content.html('');
$content.html('home stuff goes here').slideUp();
)})}
</script>
</head>
<body>
<div id="menu">
<ul>
<li class="first"><a>HOME</a></li>
<li class="second"><a>ABOUT</a></li>
<li class="third"><a>GALLERY</a></li>
<li class="fourth"><a>CONTACT</a></li>
</ul>
</div>
<div id="content">
</div>
</body>
</html>
1