This has demos and instructions...
Generally when using jquery plugins there are certain things to follow. Every plugin comes with it's own instructions and things vary...
1 "call" jquery and the plugin within the head of your html file
2 define a script for a html tag (a div or a span for example) that you want the plugin to "work" for.
3 include style sheet values and markup in your css file
4 include your markup in your body of your html file
for example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>...
<link rel="stylesheet" type="text/css" media="screen" href="cycle.css" /> [call your css]
<script type="text/javascript" src="../jquery-1.2.6.js"></script> call jquery
<script type="text/javascript" src="jquery.cycle.all.js?v2.11"></script> call plugin
<script type="text/javascript"> define for which id/class etc the plugin will work for and give it options (if any)
$('#s3').cycle({
fx: 'fade',
speed: 2500
});
</script>
</head>
<body>
<div id="s3" class="pics"> include the needed id/class etc for the plugin to work on the specific markup
    <img src="image1.jpg" width="200" height="200" /> 
    <img src="image2.jpg" width="200" height="200" /> 
    <img src="image3.jpg" width="200" height="200" /> 
</div> 
I know it seems rather complicated but it's really easy once you get the hang of it... The best thing to do is start playing...
As for the accordion menu you're after you better make a search first - there's lots of topics for this in the forum.