Problemas com jQuery (rolagem suave)

Cora Coralina · 14 de janeiro de 2013

Olá de novo

Encontrei um jQuery em um tutorial, que proporciona a rolagem suave de site de página única. Mas verifiquei que mesmo tendo-o inserido no código o efeito não aparece. Neste caso a programação já estava pronta. Será que existe algum problema com o código?

Não consigo entender nada deste tipo de linguagem.


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.mim.js"></script>
<script type="text/javascript">// <![CDATA[
$(document).ready(function() {
  function filterPath(string) {
    return string
      .replace(/^\//,'')
      .replace(/(index|default).[a-zA-Z]{3,4}$/,'')
      .replace(/\/$/,'');
  }
  $('a[href*=#]').each(function() {
    if ( filterPath(location.pathname) == filterPath(this.pathname)
    && location.hostname == this.hostname
    && this.hash.replace(/#/,'') ) {
      var $targetId = $(this.hash), $targetAnchor = $('[name=' + this.hash.slice(1) +']');
      var $target = $targetId.length ? $targetId : $targetAnchor.length ? $targetAnchor : false;
       if ($target) {
         var targetOffset = $target.offset().top;
         $(this).click(function() {
           $('html, body').animate({scrollTop: targetOffset}, 300);
           return false;
         });
      }
    }
  });
});
// ]]></script>

Obrigada. Bjos de novo!

DiF · 14 de janeiro de 2013

Olá Cora,

Infelizmente não consigo entender esse código.. acho ele um pouco sujo. No mais, tente fazer desta forma e veja se ele funciona do jeito que você precisa:


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.mim.js"></script>
<script type="text/javascript">// <![CDATA[
$('a[href^="#"]').bind('click.smoothscroll',function (e) {
	    e.preventDefault();
	    var target = this.hash,
	    $target = $(target);

	    $('html, body').stop().animate({
	        'scrollTop': $target.offset().top
	    }, 500, 'swing', function () {
	        window.location.hash = target;
	    });
	});
// ]]></script>