jQuery 锚点跳转滑动效果

jq-goto-hash.js

////////////////////////////////////////////////////////////////////////////////
// 名称: 可穿戴设备网主程序
// 作者: Steven
// 链接: http://wangwen1220.github.io/
// 说明: Require jQuery
// 更新: 2014-6-10
////////////////////////////////////////////////////////////////////////////////
// Main
(function($) {
  //'use strict';

  // Helpers
  var isIE = !!window.ActiveXObject;
  var isIE6 = isIE && !window.XMLHttpRequest;

  var supportPlaceholder = 'placeholder' in document.createElement('input');

  function log(msg) {
    window.console && console.log(msg);
  }

  function isString(val) {
    return Object.prototype.toString.call(val) === '[object String]';
  }

  // 检测文字是否为中文
  function isChinese(txt) {
    return /[\u4E00-\uFA29]+|[\uE7C7-\uE7F3]+/.test(txt);
  }

  function $$(id) {
    return 'string' === typeof id ? document.getElementById(id) : id;
    // return isString(id) ? document.getElementById(id) : id;
  }

  // jQuery Plugins
  $.fn.extend({
    // Max Height
    maxHeight: function(value) {
      if (!value) {
        return this.css('max-height');
      } else {
        return this.each(function() {
          this.style.height = this.scrollHeight > value - 1 ? value + 'px' : 'auto';
        });
      }
    },

    // Max Width
    maxWidth: function(value) {
      if (!value) {
        return this.css('max-width');
      } else {
        return this.each(function() {
          this.style.height = this.clientWidth > value - 1 ? value + 'px' : 'auto';
        });
      }
    },

    // Min Width
    minWidth: function(value) {
      if (!value) {
        return this.css('min-width');
      } else {
        return this.each(function() {
          this.style.height = this.clientWidth < value ? value + 'px' : 'auto';
        });
      }
    }
  });

  // 文档加载完执行
  $(function() {
    // log('jQury version: ' + jQuery.fn.jquery);

    // 通用变量
    var $topbar = $('#topbar');
    var $main = $('#main');
    var $gotop = $('#gotop');

    // 搜索框获得或失去焦点
    if (!supportPlaceholder) {
      $(document).on({
        focus: function() {
          var $ths = $(this);
          var defaultval = this.placeholder || this.defaultValue;
          $ths.addClass('focus').removeClass('placeholder');
          if (this.value === defaultval) {
           this.value = '';
          }
        },
        blur: function() {
          var $ths = $(this);
          var defaultval = this.placeholder || this.defaultValue;
          $ths.removeClass('focus');

          if (this.value === '') {
            this.value = defaultval;
          }
          if (defaultval === this.value) {
            $ths.addClass('placeholder');
          }
        }
      }, '.js-placeholder').find('.js-placeholder').trigger('blur');
    }

    // 滚动热门关键词
    var scrollTimer;
    $('#js-scroller').hover(function() {
      clearInterval(scrollTimer);
    }, function() {
      var $ths = $(this);
      scrollTimer = setInterval(function() {
        scroller($ths);
      }, 2000);
    }).trigger('mouseleave');

    function scroller($obj) {
      var height = $obj.find('li').height(); // 滚动高度
      $obj.find('li').first().animate({marginTop: -height}, 500, function() {
        $(this).appendTo($obj).css('margin-top', 0);
      });
    }

    // 智能浮动
    // $('#smartfloat').smartFloat();

    // 返回顶部
    $gotop.click(function() {
      $('body, html').animate({
        scrollTop: 0
      }, 600);
    });

    // 转到
    $('.goto').click(function() {
      $('body, html').animate({
        scrollTop: $($(this).attr('href')).offset().top
      }, {
        duration: 500,
        easing: 'swing'
      });
      return false;
    });

    // Tab 切换动画
    if ($.fn.etab) {
     $('.w-tab').etab();
    }

    // 焦点图动画
    if ($.fn.switchable) {
      var $switchableAlbum = $('#js-switchable-album'), $switchableAlbumNav;
      $switchableAlbumNav = $switchableAlbum.find('.w-switchable-nav');
      var switchableAlbumApi = $switchableAlbum.switchable({
        triggers: false,
        // triggers: '&bull;',
        // putTriggers: 'insertBefore',
        panels: '.w-switchable-slide-item',
        effect: 'scrollLeft',
        easing: 'ease-in-out',
        duration: 0.8,
        visible: 5,
        steps: 5,
        end2end: true,
        autoplay: true,
        prev: $switchableAlbumNav.find('.prev'),
        next: $switchableAlbumNav.find('.next'),
        onSwitch: function(event, currentIndex) {
          var api = this;
          api.prevBtn.toggleClass('disabled', currentIndex === 0);
          api.nextBtn.toggleClass('disabled', currentIndex === api.length - 1);
        },
        interval: 5,
        api: true
      });

      // 暂停播放
      $switchableAlbumNav.on({
        mouseenter: function() {
          switchableAlbumApi.pause();
        },
        mouseleave: function() {
          switchableAlbumApi.play();
        }
      });
    }

    // myFocus 焦点图设置
    //myFocus.set({id:'myFocus', pattern:'mF_ofweek', wrap: false, trigger: 'mouseover'});

    // 标记表格奇偶行
    //$('.js-table tbody').find('tr:odd').addClass('odd').end().find('tr:even').addClass('even');

    // IE6 兼容性处理
    if (isIE6) {
      // 解决 IE6 hover Bug
      $topbar.find('.dropmenu').hover(function() { $(this).toggleClass('drop'); });

      // $main.find('.w-topline:first-child').addClass('first-child')

    //   // 产品标题和描述最大高度
    //   $('#main .proshow-bd .prolist-item .title').maxHeight(54);
    //   $('#main .proshow-bd .prolist-item .description').maxHeight(70);

    //   // 设置遮罩层宽高
    //   $('.ui-overlay').width($(window).width()).height($(window).height());
    }
  });

  // 页面加载完执行
  $(window).load(function() {
    if (isIE6) {
      // 让 IE6 缓存背景图片
      // TredoSoft Multiple IE doesn't like this, so try{} it
      try {
        document.execCommand("BackgroundImageCache", false, true);
      } catch(r) {}
    }
  });
})(jQuery);