Cómo configurar con opacidad los elementos inactivos li utilizando el carrusel de jQuery - jquery, carrusel

Estoy intentando esforzarme un poco por el carrusel, me gustaría tener la posibilidad de cambiar la opacidad de los elementos inactivos en el carrusel.

    <section class="wrap">

<div></div>
</section>

<section id="carousel">
<ul>
<li>

<div class="col">1</div>
<div class="col">2</div>
<div class="col">3</div>

</li>
<li>

<div class="col">4</div>
<div class="col">5</div>
<div class="col">6</div>

</li>
<li>



$(document).ready(function() {
$("#carousel ul").jcarousel({
scroll:1,
auto:5,
wrap:"both",
easing: "easeInOutBack",
buttonNextHTML: null,
buttonPrevHTML: null
});

});​

En esto enlazar a continuación hay un ejemplo, de lo que me gustaría obtener, a partir de la div central. col, dejar que los demás elementos, el de la izquierda y la derecha con una casi invisible, es posible ???

¡Gracias de antemano!

Respuestas

Encontré un ejemplo del autor del Plugin, creo que hace lo que quieres. Puedes consultar este enlace:

https://github.com/jsor/jcarousel/tree/91b1616fab0e3dfbdb8f39e42f39c48cbe6000d6/examples/feature_slider

// EDITAR, puedes probar esto, con un poco de trabajo, debería funcionar.

CSS - .jcarousel-item { opacity : 0.1 } .jcarousel-item.active { opacity: 1 !important }

JS -

jQuery(document).ready(function() {
jQuery("#mycarousel").jcarousel({
visible: 3,
scroll: 1,
itemVisibleInCallback: {
onAfterAnimation: function ( c, o, i, s ) {
i = ( i - 2 ) % $("#mycarousel li").size();
jQuery(".jcarousel-item").removeClass("active");
jQuery(".jcarousel-item").eq( i ).addClass("active");
}
}
});

});

Al aire libre

Al aire libre