Java脚本相互冲突

时间:2015-06-06 19:27:35

标签: javascript jquery

我试图在一个页面中使用两个单独的脚本,当然它们会相互冲突。我仍然是一个新的JavaScript,所以我不知道如何解决它。如果有人与我分享他或她的智慧,我将非常感激。

这是我的代码:

$(document).ready(function() {
var slider = {


  el: {
  slider: $("#slider"),
allSlides: $(".slide"),
sliderNav: $(".slider-nav"),
allNavButtons: $(".slider-nav > a")
},

timing: 800,
slideWidth: 1349, 

init: function() {
this.bindUIEvents();
},

bindUIEvents: function() {

this.el.slider.on("scroll", function(event) {
  slider.moveSlidePosition(event);
});

this.el.sliderNav.on("click", "a", function(event) {
  slider.handleNavClick(event, this);
});

},

moveSlidePosition: function(event) {

this.el.allSlides.css({
  "background-position": $(event.target).scrollLeft()/0-1349+ "px 0"
});  
},

handleNavClick: function(event, el) {
event.preventDefault();
var position = $(el).attr("href").split("-").pop();

this.el.slider.animate({
  scrollLeft: position * this.slideWidth
}, this.timing);

this.changeActiveNav(el);
},

changeActiveNav: function(el) {
this.el.allNavButtons.removeClass("active");
$(el).addClass("active");
}

};

slider.init();
});

$(document).ready(function() {
function filterPath(string) {
return string
.replace(/^\//,'')
.replace(/(index|default).[a-zA-Z]{3,4}$/,'')
.replace(/\/$/,'');
 }
 var locationPath = filterPath(location.pathname);
 var scrollElem = scrollableElement('html', 'body');

 $('a[href*=#]').each(function() {
 var thisPath = filterPath(this.pathname) || locationPath;
 if (  locationPath == thisPath
 && (location.hostname == this.hostname || !this.hostname)
 && this.hash.replace(/#/,'') ) {
  var $target = $(this.hash), target = this.hash;
  if (target) {
    var targetOffset = $target.offset().top;
    $(this).click(function(event) {
      event.preventDefault();
      $(scrollElem).animate({scrollTop: targetOffset}, 1100, function() {
        location.hash = target;
      });
    });
    }
   }
 });

 function scrollableElement(els) {
 for (var i = 0, argLength = arguments.length; i <argLength; i++) {
  var el = arguments[i],
      $scrollElement = $(el);
  if ($scrollElement.scrollTop()> 0) {
    return el;
  } else {
    $scrollElement.scrollTop(1);
    var isScrollable = $scrollElement.scrollTop()> 0;
    $scrollElement.scrollTop(0);
    if (isScrollable) {
      return el;
    }
   }
  }
  return [];
 }

 });

0 个答案:

没有答案