Intégration de Galleria avec le plugin SmoothDivScroll

Question

J'ai travaillé sur une intégration de SmoothScrollDiv avec Galleria .. - pour faire défiler les vignettes.

démo de mon code ici: http://test.kinkylemon.nl/sym/galleria/demo3.htm

J'ai un problème que lorsque la fenêtre du navigateur est redimensionnée, SmoothScrollDiv n'est plus correctement lié au DOM ... ou quelque chose comme ça! - Ça arrête de fonctionner.

bug similaire dans IE6 au chargement de la page (avec un cache vide).

alors Question A. dois-je utiliser bind() ou live() en quelque sorte?

$(function($) { $('ul#gallery').galleria({ 
      history : false, // activates the history object for bookmarking, back-button etc. 
      clickNext : true, // helper for making the image clickable 
      insert : '#galleriaContentBox', // the containing selector for our main image 
      onImage : function(image,caption,thumb) { // let's add some image effects for demonstration purposes 

       // fade in the image & caption 
       if(! ($.browser.mozilla && navigator.appVersion.indexOf("Win")!=-1)) { // FF/Win fades large images terribly slow 
        image.css('display','none').fadeIn(1000); 
       } 

       // fetch the thumbnail container 
       var _li = thumb.parents('li'); 

       // fade out inactive thumbnail 
       _li.siblings().children('img.selected').fadeTo(500,0.3); 

       // fade in active thumbnail 
       thumb.fadeTo('fast',1).addClass('selected'); 

       // this will add a class to landscape images allowing extra margin 
       if (image.height() < image.width()) { 
        $('#galleriaContentBox').addClass('landscape'); 
       } else { 
        $('#galleriaContentBox').removeClass('landscape'); 
       } 

      }, 
      onThumb : function(thumb) { // thumbnail effects goes here 

       // fetch the thumbnail container 
       var _li = thumb.parents('li'); 

       // if thumbnail is active, fade all the way. 
       var _fadeTo = _li.is('.active') ? '1' : '0.3'; 

       // fade in the thumbnail when finnished loading 
       thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500); 

       // hover effects 
       thumb.hover(
        function() { thumb.fadeTo('fast',1); }, 
        function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active 
       ) 
      } 
     }); 
    }); 


    $(document).ready(function() { 
     //$(function() { 
      $("div#smallScroller").smoothDivScroll({ 
       scrollableArea: "ul.scrollableArea", //The identifier of the actual element that is scrolled left or right. 
       mouseDownSpeedBooster: 2, 
       scrollingSpeed: 25, 
       autoScrollDirection: 'endlessloop' 
       //visibleHotSpots: 'always' 
      }); 
     //}); 
    }); 

.. et B. Question ... Je viens de voir ce qui suit à: http://maaki.com/thomas/SmoothDivScroll/ - est-ce le problème? - Dois-je utiliser un plugin différent? ..maybe reconstruire avec jCarousel

« Smooth Div défilement ne recalcule pas la zone défilante. Le recalcul est fait en premier lorsque l'utilisateur redimensionne la fenêtre du navigateur. En regardant le code source, il y a une fonction appelée « windowIsResized » Ceci est déclenché lorsque l'utilisateur redimensionne la fenêtre du navigateur et recalcule (entre autres) la largeur de la zone de défilement Le code doit être réécrit avec une fonction générale qui "réinitialise" le défileur. une partie de l'API publique afin qu'elle puisse être appelée par le développeur après qu'un chargement de contenu AJAX a été effectué. "

Answer 1

Question B était la bonne - le problème est que le plug-in a besoin d'une mise à jour SmoothDivScroll à sa fonction windowIsResize

Je Reconstruit jCarousel - fonctionne bien. Toujours à la recherche d'un moyen de répliquer la fonctionnalité mouseover réalisée avec SmoothDivScroll - n'est pas possible avec jCousel, il semble ..