Добавление ScrollTo в сценарий jQuery UI Accordion - PullRequest
Новая
       45

Добавление ScrollTo в сценарий jQuery UI Accordion

1 голос
/ 24 марта 2011

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

<script type="text/javascript">
        /* <![CDATA[ */
        jQuery().ready(function(){
            jQuery('#leftnav-navigation').accordion({
                active: false,
                header: '.head',
                navigation: true,
                collapsible: true,
                animated: 'easeslide',
                autoheight: false,
                alwaysOpen: false,
            });

            var accordions = jQuery('#leftnav-navigation'); 

            jQuery('#switch select').change(function() {
                accordions.accordion("activate", this.selectedIndex-1);
            });
            jQuery('#close').click(function() {
                accordions.accordion("activate", -1);
            });
            jQuery('#switch2').change(function() {
                accordions.accordion("activate", this.value);
            });
            jQuery('#enable').click(function() {
                accordions.accordion("enable");
            });
            jQuery('#disable').click(function() {
                accordions.accordion("disable");
            });
            jQuery('#remove').click(function() {
                accordions.accordion("destroy");
                wizardButtons.unbind("click");
            });
            return false;
        });
        /* ]]> */
    </script>

Спасибо ckaufman за помощь.Вот окончательный рабочий код.Я надеюсь, что это помогает кому-то нуждающемуся. 

<script type="text/javascript">
        /* <![CDATA[ */
        jQuery().ready(function(){
            jQuery('#leftnav-navigation').accordion({
                active: false,
                header: '.head',
                navigation: true,
                collapsible: true,
                animated: 'easeslide',
                autoheight: false,
                alwaysOpen: false,
            });

            var accordions = jQuery('#leftnav-navigation'); 

            jQuery('#switch select').change(function() {
                accordions.accordion("activate", this.selectedIndex-1);
            });
            jQuery('#close').click(function() {
                accordions.accordion("activate", -1);
            });
            jQuery('#switch2').change(function() {
                accordions.accordion("activate", this.value);
            });
            jQuery('#enable').click(function() {
                accordions.accordion("enable");
            });
            jQuery('#disable').click(function() {
                accordions.accordion("disable");
            });
            jQuery('#remove').click(function() {
                accordions.accordion("destroy");
                wizardButtons.unbind("click");
            });

            jQuery('#leftnav-navigation').click(
                function() {
                    var window_top = $(window).scrollTop();
                    var div_top = $(this).offset().top;
                        if (window_top > div_top){
                            $('html, body').animate({scrollTop:div_top}, 300);
                }
            });

            return false;
        });
        /* ]]> */
    </script>

Ответы [ 2 ]

1 голос
/ 24 марта 2011

Я думаю, что-то в этом роде может работать.Я объясню, и, возможно, с некоторыми изменениями вы можете реализовать это. 

jQuery('#divID').click(
  function() {
  var window_top = $(window).scrollTop();
  var div_top = $(this).offset().top;
     if (window_top > div_top){
     $('html, body').animate({scrollTop:div_top}, 300);
     }
    });

Щелчок связывает событие, которое обнаружит div_top и window_top ... Если div выше window_top, то этопрокрутить до местоположения div_top.Стоит попробовать, надеюсь, это поможет.

0 голосов
/ 24 марта 2011

На самом деле, я уже сделал это ...

Вам необходимо добавить scrollTo.js в jQuery в ваш проект, а затем заменить файл ui.accordion.js на файл в предоставленном JSFiddle: http://jsfiddle.net/Jaybles/6EWAF/

...