JQuery jCarousel - Désactivation des contrôles externes

j'utilise JQuery et Jcarousel, en utilisant les contrôles de navigation externes: http://sorgalla.com/projects/jcarousel/examples/static_controls.html JQuery jCarousel - Désactivation des contrôles externes

Le problème est ici les boutons de navigation ne sont plus désactivent comme indiqué ici:

sorgalla.com/ projects/jcarousel/examples/static_simple.html

Y at-il un rappel que je peux utiliser pour me permettre d'échanger l'image active d'un bouton avec une image inactive?

Source

2010-05-04 iltdev

MISE À JOUR

DEMO:http://jsbin.com/ifomi4/5SOURCE:http://jsbin.com/ifomi4/5/edit

En responce à votre Dernière commentaire:

Tout le code dont vous avez besoin (CSS inclus) est dans la source, je l'ai commenté si facile à voir!

function disableCustomButtons(carousel){ 

    var prev_class = 'jcarousel-prev-disabled jcarousel-prev-disabled-horizontal'; 
    if (carousel.first == 1) { 
    $('#mycarousel-prev').attr('disabled', 'true').addClass(prev_class); 
    } else { 
    $('#mycarousel-prev').attr('disabled', 'false').removeClass(prev_class); 
    } 

    var next_class = 'jcarousel-next-disabled jcarousel-next-disabled-horizontal'; 
    if (carousel.last == carousel.size()) { 
    $('#mycarousel-next').attr('disabled', 'true').addClass(next_class); 
    } else { 
    $('#mycarousel-next').attr('disabled', 'false').removeClass(next_class); 
    } 

}

DEMO:http://jsbin.com/ifomi4

SOURCE: http://jsbin.com/ifomi4/edit

Le Tweek se composent de ajouter une classe appropriée à votre propre bouton NEXT & PREV comme ceci:

<a class="jcarousel-prev jcarousel-prev-horizontal" href="#">&nbsp;</a> 

<a class="jcarousel-next jcarousel-next-horizontal" href="#">&nbsp;</a>

et enfin un peu de css pour avoir l'image au centre de notre curseur

/* SET THE MARGIN AS YOU NEED */ 
    .jcarousel-scroll a { margin: 25px 0 }

Cela devrait fonctionner comme prévu! mais juste voir la démo et vous l'avez, j'ai commenté les parties essentielles!

Source

2010-05-04 13:55:35

Étrange, j'ai essayé d'ajouter un commentaire mais cela n'a pas fonctionné. Je vais réessayer ... Je comprends comment désactiver les boutons de navigation intégrés et comment utiliser les contrôles externes, c'est-à-dire les contrôles en dehors de la liste. Cependant, en utilisant leur exemple http://sorgalla.com/projects/jcarousel/examples/static_controls.html, les contrôles sont simplement des hyperliens. Je souhaite conserver la navigation par bouton d'image des boutons intégrés, y compris leur fonctionnalité, c'est-à-dire passer à l'image désactivée (grisée) au début et à la fin. Cependant, je dois le faire en dehors de la liste - d'où la nécessité de contrôles externes. – iltdev

voir les mises à jour et faites le moi savoir! –

Juste pour être une vraie douleur, y at-il un moyen d'avoir le bouton suivant et prev en dehors de la div mycarousel? L'idée est que j'ai un div contenu qui est divisé en un div de titre en haut, puis un contenu div ci-dessous. Je veux que les commandes soient placées dans le div du titre (aligné à droite) et le carrousel dans le contenu div. Actuellement, les contrôles ne fonctionnent que s'ils sont imbriqués dans la div mycarousel. comme solution de contournement J'ai placé les divs mycarousel et wrap à l'extérieur de mon propre conteneur div. Il a fallu un peu de modification css mais le résultat final ressemble exactement à ce que je veux :) – iltdev

JQuery jCarousel - Désactivation des contrôles externes

Répondre

Questions connexes