I found a great downloadable slider plugin at: Slides, A Slideshow Plugin for jQuery I love the look of this slider and want to incorporate it into our site, but I am a total newbie at coding. I am running the Thesis theme on Wordpress and thought this would be a simple cut and paste, but I've been pulling my hair out over it for about 5 days.

Here is the code as I have it right now on my site. It works partway in Safari and Opera on Mac, not at all in FF, Chrome or IE anywhere.

In the header:

Code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
	<script src="http:/www.journalinabox.com/wp-content/themes/thesis_18/thesis_18/custom/js/slides.min.jquery.js"></script>

<script>
( function($) {		$(document).ready(function() {
		$('#slides').slides({
				preload: true,
				preloadImage: 'http:/www.journalinabox.com/wp-content/themes/thesis_18/thesis_18/custom/images/slides/loading.gif',
				play: 5000,
				pause: 2500,
				hoverPause: true
			});
		})) ( jQuery );
</script>
In the php:

PHP Code:
function slides_standard() {
?>
<div id="slides_standard_container">
        <div id="example">
            <img src="http:/www.journalinabox.com/wp-content/themes/thesis_18/thesis_18/custom/images/slides/coming-soon.png" width="112" height="112" alt="Coming Soon" id="ribbon">
            <div id="slides">
                <div class="slides_container">
                    <a href="http://www.journalinabox.com/product-testing/" title="Journal in a BoxTM Original Edition" target="_blank"><img src="http:/www.journalinabox.com/wp-content/themes/thesis_18/thesis_18/custom/images/slides/dont-pick-up.png" width="570" height="270" alt="Slide 1"></a>
                    <a href="http://www.flickr.com/photos/stephangeyer/3020487807/" title="Taxi | Flickr - Photo Sharing!" target="_blank"><img src="http://slidesjs.com/examples/standard/img/slide-2.jpg" width="570" height="270" alt="Slide 2"></a>
                </div>
                <a href="#" class="prev"><img src="http:/www.journalinabox.com/wp-content/themes/thesis_18/thesis_18/custom/images/slides/arrow-prev.png" width="24" height="43" alt="Arrow Prev"></a>
                <a href="#" class="next"><img src="http:/www.journalinabox.com/wp-content/themes/thesis_18/thesis_18/custom/images/slides/arrow-next.png" width="24" height="43" alt="Arrow Next"></a>
            </div>
            <img src="http:/www.journalinabox.com/wp-content/themes/thesis_18/thesis_18/custom/images/slides/example-frame.png" width="739" height="341" alt="Example Frame" id="frame">
        </div>
    </div>
<?php
}
add_action('thesis_hook_feature_box''slides_standard');
In the css:

Code:
#feature_box {
    background: none;
    border: none;
	padding: 0;
}

#slides_standard_container {
	width:580px;
	padding:10px;
	margin:0 auto;
	position:relative;
	z-index:0;
}

#example {
	width:600px;
	height:350px;
	position:relative;
}

#ribbon {
	position:absolute;
	top:-3px;
	left:-15px;
	z-index:500;
}

#frame {
	position:absolute;
	z-index:0;
	width:739px;
	height:341px;
	top:-3px;
	left:-80px;
}

/*
	Slideshow
*/

#slides {
	position:absolute;
	top:15px;
	left:4px;
	z-index:100;
}

/*
	Slides container
	Important:
	Set the width of your slides container
	Set to display none, prevents content flash
*/

.slides_container {
	width:570px;
	overflow:hidden;
	position:relative;
	display:none;
}

/*
	Each slide
	Important:
	Set the width of your slides
	If height not specified height will be set by the slide content
	Set to display block
*/

.slides_container a {
	width:570px;
	height:270px;
	display:block;
}

.slides_container a img {
	display:block;
}

/*
	Next/prev buttons
*/

#slides .next,#slides .prev {
	position:absolute;
	top:107px;
	left:-39px;
	width:24px;
	height:43px;
	display:block;
	z-index:101;
}

#slides .next {
	left:585px;
}

/*
	Pagination
*/

.pagination {
	margin:26px auto 0;
	width:100px;
}

.pagination li {
	float:left;
	margin:0 1px;
	list-style:none;
}

.pagination li a {
	display:block;
	width:12px;
	height:0;
	padding-top:12px;
	background-image:url(http://www.journalinabox.com/wp-content/themes/thesis_18/thesis_18/custom/images/slides/pagination.png);
	background-position:0 0;
	float:left;
	overflow:hidden;
}

.pagination li.current a {
	background-position:0 -12px;
}
Any help as to what is going wrong with my code would be greatly appreciated!