2010-01-15 1 views
1

Я работаю над интеграцией SmoothScrollDiv с Galleria .. - для прокрутки эскизов.Интеграция Galleria с плагином SmoothDivScroll

демо мой код здесь: http://test.kinkylemon.nl/sym/galleria/demo3.htm

У меня есть проблема, что, когда окно браузера изменяет размер, SmoothScrollDiv больше не правильно связан с DOM ... или что-то подобное! - он перестает работать.

также аналогичная ошибка в IE6 при загрузке страницы (с пустым кешем).

так Вопрос A. Мне нужно использовать bind() или live() как-то?

$(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' 
      }); 
     //}); 
    }); 

.. и вопрос B. ... Я просто увидел следующую: http://maaki.com/thomas/SmoothDivScroll/ - это проблема? - Должен ли я использовать другой плагин? ..maybe перестраивать с jCarousel

«Smooth Div прокрутки не пересчитывать прокручивать область. перерасчет делается первым, когда пользователь изменяет размер окна браузера. Глядя на исходный код, есть функция называется „windowIsResized“ .Это срабатывает, когда пользователь изменяет размер окна браузера , и он (между прочим) правильно пересчитывает ширину области прокрутки . Код должен быть переписан с помощью общей функции , которая «повторно инициализирует» скроллер. a часть публичного API, так что он может быть вызван разработчиком после загрузки AJAX. "

ответ

0

Вопрос B был правильным - проблема заключалась в том, что плагин SmoothDivScroll нуждается в обновлении своей функции windowIsResize

Я перестроен с jCarousel - работает хорошо. Все еще ищете способ репликации функций мыши, достигнутых с помощью SmoothDivScroll, невозможно с jCarousel, похоже.

 Смежные вопросы

  • Нет связанных вопросов^_^