please can someone help

hi i am a beginner of jquery really and i am trying to build a hide and slide box and when opened it has 3 page of swap page content inside but i am not getting the hang of it. i would be very grateful if someone can look at my code and point me in the right way in achieving this, many thanks, Gary.

the website that it is on is http://cumcloser.co.uk/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>Untitled Document</title>

$(document).ready(function(){

$(".accordion2 h3").eq(2).addClass("active");

$(".accordion2 p").eq(2).hide();

$(".accordion2 h3").click(function(){

$(this).next("p").slideToggle("slow")

.siblings("p:visible").slideUp("slow");

$(this).toggleClass("active");

$(this).siblings("h3").removeClass("active");

});

$(document).ready(function(){

// When user clicks on tab, this code will be executed

$("#tabs li").click(function() {

// First remove class "active" from currently active tab

$("#tabs li").removeClass('active');

// Now add class "active" to the selected/clicked tab

$(this).addClass("active");

// Hide all tab content

$(".tab_content").hide();

// Here we get the href value of the selected tab

var selected_tab = $(this).find("a").attr("href");

// Show the selected tab content

$(selected_tab).fadeIn();

// At the end, we add return false so that the click on the link is not executed

return false;

});

</script>

body {

font: 75%/120% Arial, Helvetica, sans-serif;

}

.accordion2 {

width: 480px;

border-bottom: solid 1px #c4c4c4;

}

.accordion2 h3 {

background: #5CACEE url(style/arrow-square.gif) no-repeat right -51px;

padding: 7px 15px;

margin: 0;

font: bold 120%/100% Arial, Helvetica, sans-serif;

border: solid 1px #c4c4c4;

border-bottom: none;

cursor: pointer;

}

.accordion2 h3:hover {

background-color: #B0E2FF;

}

.accordion2 h3.active {

background-position: right 5px;

}

.accordion2 p {

background: #f7f7f7;

margin: 0;

padding: 10px 15px 20px;

border-left: solid 1px #c4c4c4;

border-right: solid 1px #c4c4c4;

display: none;

}

#tabs_wrapper {

width: 422px;

}

#tabs_container {

border-bottom: 1px solid #ccc;

}

#tabs {

list-style: none;

padding: 5px 0 4px 0;

margin: 0 0 0 10px;

font: 0.75em arial;

}

#tabs li {

display: inline;

}

#tabs li a {

border: 1px solid #ccc;

padding: 4px 6px;

text-decoration: none;

background-color: #eeeeee;

border-bottom: none;

outline: none;

border-radius: 5px 5px 0 0;

-moz-border-radius: 5px 5px 0 0;

-webkit-border-top-left-radius: 5px;

-webkit-border-top-right-radius: 5px;

}

#tabs li a:hover {

background-color: #dddddd;

padding: 4px 6px;

}

#tabs li.active a {

border-bottom: 1px solid #fff;

background-color: #fff;

padding: 4px 6px 5px 6px;

border-bottom: none;

}

#tabs li.active a:hover {

background-color: #eeeeee;

padding: 4px 6px 5px 6px;

border-bottom: none;

}

#tabs li a.icon_accept {

background-image: url(accept.png);

background-position: 5px;

background-repeat: no-repeat;

padding-left: 24px;

}

#tabs li a.icon_accept:hover {

padding-left: 24px;

}

#tabs_content_container {

border: 1px solid #ccc;

border-top: none;

padding: 10px;

width: 400px;

}

.tab_content {

display: none;

}

</style>

</head>

<body>

<?php include_once "header.php";?>

<tr>

<ul>

</ul>

<ul>

<li><a href="http://cumcloser.co.uk/about.php">About</a>

<ul>

<li><a href="http://cumcloser.co.uk/portfolio.php">portfolio</a></li>

<li><a href="http://cumcloser.co.uk/questionaire.php">"questionaire"</a></li>

<li><a href="http://cumcloser.co.uk/contact.php">"Contact"</a></li>

</ul>

</li>

</ul>

<ul>

<li><a href="http://cumcloser.co.uk/contact.php">Contact</a>

<ul>

</ul>

</li>

</ul>

</div>

</div></td>

</tr>

</table>

<tr>

</tr>

<tr>

<td>jnfjnfvnmnmndfjn</td>

</tr>

<tr>

<h3>Design</h3>

</ul>

</div>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum nibh urna, euismod ut ornare non, volutpat vel tortor. Integer laoreet placerat suscipit. Sed sodales scelerisque commodo. Nam porta cursus lectus. Proin nunc erat, gravida a facilisis quis, ornare id lectus. Proin consectetur nibh quis urna gravida mollis.</p>

</div>

</div>

<p>Suspendisse blandit velit eget erat suscipit in malesuada odio venenatis.</p>

</div>

</div></p>

<h3>This is Question Two</h3>

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi malesuada, ante at feugiat tincidunt, enim massa gravida metus, commodo lacinia massa diam vel eros. Proin eget urna. Nunc fringilla neque vitae odio. Vivamus vitae ligula.</p>

<h3>Another Questio here</h3>

<h3>Sample heading</h3>

<h3>Sample Question Heading</h3>

</div></td>

</tr>

<tr>

</tr>

</table>

<?php include_once "footer.php";?>

</body>

</html>

Topic Participants
bhcloser
jakecigar

please can someone help

please can someone help

Topic Participants

bhcloser

jakecigar