在jQuery UI中添加ScrollTo手风琴脚本

我搜索了高和低，并没有找到帮助我的具体情况的帖子。我对jQuery很陌生，喜欢它的广泛用途。我的手风琴脚本存在问题，我需要添加ScrollTo，以便在选中某个部分时，如果它位于视图上方，则将其滚动到上方。我希望这是有道理的。感谢您的帮助。在jQuery UI中添加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>

来源

2011-03-24 Dan

我认为沿着这些线可能有效。我会解释，也许有一些调整你可以实现它。

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的位置。值得一试，希望它有帮助。

来源

2011-03-24 20:00:12 ckaufman

@ckaufman ...谢谢你的提示。我会给它一个镜头，并跟进。谢谢。 – Dan 2011-03-24 20:02:51

让我知道它是怎么回事，我用了一个类似于这个脚本的脚本，并认为可能有一些东西需要从中获取。 – ckaufman 2011-03-24 20:11:30

@ckaufman ...谢谢你的提示。它只需稍作调整即可解决我的需求。由此产生的功能正是我所期待的。最终的代码在原始文章的上方。谢谢你的帮助。 – Dan 2011-03-24 21:04:08

其实，我已经做到了这一点......

你需要jQuery的scrollTo.js添加到您的项目，然后替换ui.accordion.js文件与一个在的jsfiddle前提：http://jsfiddle.net/Jaybles/6EWAF/

来源

2011-03-24 20:02:08 Dutchie432

感谢您的建议。我用另一篇文章得到了我需要的确切结果。干杯。 – Dan 2011-03-24 21:07:36

在jQuery UI中添加ScrollTo手风琴脚本

回答

相关问题