Подскажите слайдер-меню!

Карусель обычно меняет контент и устанавливать обработчик $().click нужно не сразу в ready, а в callback'e инициализации. Естественно нужно не забыть остановить карусель при клике/ховере и про привязывание событий к вновь появившимся слайдам.

Для примера в jcarousel:

$(document).ready(function() {

        $('#slider').jcarousel({

            //нужные параметры

            initCallback: mycarousel_initCallback,

            itemVisibleInCallback: {

                onAfterAnimation:  mycarousel_itemVisibleInCallbackAfterAnimation

            } 

        });

    });



    function mycarousel_initCallback(carousel) {

        $('.jcarousel-control a').bind('click', function() {

            //необходимые трансформации 

           //объект carousel тоже доступен

           // селектор '.jcarousel-control a' поменяйте на свой

        });

        carousel.clip.hover(function() {

            carousel.stopAuto();

        }, function() {

            carousel.startAuto();

        });

    }

mycarousel_itemVisibleInCallbackAfterAnimation - по аналогии с $().bind

спасибо конечно, но если б я хоть не много разбирался в джейквери... в этом нуб

вот поставил такую карусель, но видимо чтото упустил... 1-й слайд наполняется текстом... последующие же не отображает... и кнопка подробнее прыгает...

если я действовал не в том направлении - так и скажите, признателен

    

		<script type="text/javascript" language="javascript" src="js/jquery.carouFredSel-3.0.2-packed.js"></script>

		<script>

			$(function() {

				$('ul#basic_config').carouFredSel();

				$('ul#user_interaction').carouFredSel({

					items: {

						visible	: 'variable'

					},

					auto: false,

					prev: "#prev1",

					next: "#next1"

				});

				$('#vnoviwvw').carouFredSel({

					items: {

						visible	: 'variable',

						width	: 'variable'

					},

					next: '#next2',

					prev: '#prev2'

				});

			});

		</script>

		

код:

		<div id="wrapper">

				<div class="list_carousel">

					<ul id="user_interaction">

						<li><a href="#"><img src="img/karuselimghover.jpg" alt="" /></a>

                        <span class="slnakladka">

                        <p><span>Наливные полы</span>

                        Наливные полы в Туле сейчас на

пике популярности. Их изготавли-

вают, используя экологически...</p>

                        </span>

                        <span class="ssilka1">

                        	<a href="#">Больше информации ></a>

                        </span>

                        </li>

						

                        

						<li><a href="#"><img src="img/karuselimghover.jpg" alt="" /></a>

                        <span class="slnakladka">

                        <p><span>Наливные полы</span>

                        Наливные полы в Туле сейчас на

пике популярности. Их изготавли-

вают, используя экологически...</p>

                        </span>

                        <span class="ssilka1">

                        	<a href="#">Больше информации ></a>

                        </span>

                        </li>

                        

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

						<li><a href="#"><img src="img/partner1.jpg" alt="" /></a></li>

					</ul>

					<div class="clearfix"></div>

					<a id="prev1" href="#">&lt;</a>

					<a id="next1" href="#">&gt;</a>

              </div>

		</div>

        

стили к ней:

			#wrapper {

				width: 1004px;

				margin: auto;

				min-height: 100%;

				padding: 500px 0 0 0;

			}

			.list_carousel {

				margin: 0 0 0 0;

				width: 1004px;

			}

			.list_carousel ul {

				margin: 0;

				padding: 0;

				list-style: none;

				display: block;

			}

			.list_carousel li {

				font-family:Georgia, "Times New Roman", Times, serif;

				text-align: center;

				background-color: #ffffff;

				border: 0;

				width: 230px;

				height: 310px;

				padding: 0 0 0 0;;

				margin: 30px 5px 0 5px;

				display: block;

				float: left;

			}

			.list_carousel li a{

				position:absolute;

				z-index: 207;

				background-color: #ffffff;

				width: 230px;

				height: 310px;

			}

			.list_carousel li img {

				border:0;

				width: 230px;

				height: 164px;

			}

			.list_carousel li:hover {

				width: 230px;

				height: 280px;

				padding: 0 0 0 0;

				margin: 5px;

			}

			.clearfix {

				float: none;

				clear: both;

			}

			#prev1, #prev2 {

				margin-left: 10px;

			}

			#next1, #next2 {

				float: right;

				margin-right: 10px;

			}

			

					

.list_carousel li span.slnakladka{

	position:absolute;

	z-index: 209;

	top:200px;

	left:5px;

	padding: 0 0 0 0;

	width: 230px;

	color: #000000;

	font-size: 12px;

	background-color:#ffffff;

	text-align:left;

	}					

.list_carousel li span.slnakladka p{

	padding: 5px 5px 0 10px;

	width: 210px; 

	color: #000000;

	font-size: 12px;

	text-align:14px;

	}					

.list_carousel li span.slnakladka p span{

	float:left;

	padding: 0 0 7px 0;

	color: #905536;

	font-style:italic;

	font-size: 20px;

	}				

.list_carousel li span.ssilka1{

	position:absolute;

	z-index: 204;

	top:310px;

	left:5px;

	}								

.list_carousel li span.ssilka1 a{

	display:block;

	color: #ffffff;

	font-size: 12px;

	padding: 9px 0 0 0;

	width: 230px;

	height: 30px;

	text-align:center;

	background: url('img/karusnakladka.jpg') no-repeat;

	}		

.list_carousel li span.ssilka1 a:hover{

	text-decoration:none;

	background: url('img/karusnakladka.jpg') no-repeat;

	}