Picasa Embed Gallery + Пользовательский слайдер jQuery UI

Я пытаюсь создать инструмент, который прокручивает динамические элементы из Picasa. Picasa позволяет использовать вложенные файлы, что означает, что новые элементы загружаются снова и снова, когда пользователь перемещается по файловой системе.

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

Если кто-то может помочь мне интегрировать этот плагин, я был бы очень благодарен. Плагин очень хорошо документирован, но я все еще новичок в jQuery, поэтому мне не очень повезло.

Спасибо.

Плагин слайдера пользовательского интерфейса jQuery: http://www.simonbattersby.com/blog/vertical-scrollbar-using-jquery-ui-slider/

Вставить фрагмент Picasa:

jQuery(document).ready(function() {
    jQuery("#picasagallery").EmbedPicasaGallery('andreagerstmann',{
        loading_animation: 'css/loading.gif',
        size: '190',
        msg_loading_list :  'Just one moment please',
        msg_back :   'Back'
    });
});

Выполняется Копия: http://andreagerstmann.com/gallery.html


scroll jquery jquery-ui gallery picasa
person patrick    schedule 29.10.2011    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Патрик

Дает ли этот вариант слайдера то, что вы хотите:

http://www.simonbattersby.com/demos/vertical_scrollbar_demo_7_addcontent.htm

В этом варианте код ползунка заключен в функцию setSlider(), так что вам просто нужно будет вызвать эту функцию после завершения кода Picasa.

Саймон

person Simon    schedule 02.11.2011

arrow_upward
0
arrow_downward

Я сделал это некоторое время назад, используя:

Загрузите большой набор данных с бесконечной прокруткой в ​​ASP.NET (VBASPNETInfiniteLoading) http://code.msdn.microsoft.com/VBASPNETInfiniteLoading-10c3f379

исходная статья: http://www.webresourcesdepot.com/load-content-while-scrolling-with-jquery/

рабочий пример: http://www.webresourcesdepot.com/dnspinger/

    <link rel="stylesheet" href="Styles/Site.css" type="text/css" />
    <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>



    $(document).ready(function () {

       function lastPostFunc() {
           $('#divPostsLoader').html('<img src="images/bigLoader.gif">');

           //send a query to server side to present new content
           $.ajax({
               type: "POST",
               url: "Default.aspx/Foo",
               data: "{}",
               contentType: "application/json; charset=utf-8",
               dataType: "json",
               success: function (data) {

                   if (data != "") {
                       $('.divLoadData:last').after(data.d);
                   }
                   $('#divPostsLoader').empty();
               }

           })
       };

       //When scroll down, the scroller is at the bottom with the function below and fire
    the lastPostFunc function
       $(window).scroll(function () {
           if ($(window).scrollTop() == $(document).height() - $(window).height()) {
               lastPostFunc();
           }
       });

    });
person Leblanc Meneses    schedule 08.11.2011