需要帮助将此JavaScript代码应用于我现有的代码

时间:2016-04-14 19:17:53

标签: javascript html

我已经完成了一个简单的音乐切换按钮,我一直在努力,希望它可以淡入我的页面,就像我的网站上滚动到顶部按钮一样(like the one which you can see here when scrolling down)。

我设法从滚动到顶部按钮获取javascript,如下所示:

var start = {
  setting: {
    startline: 100,
    scrollto: 0,
    scrollduration: 1e3,
    fadeduration: [500, 100]
  },
  controlHTML: '<img src=".../noaudio.png"/>',
  },
  state: {
    isvisible: !1,
    shouldvisible: !1
  },
  scrollup: function() {
  this.cssfixedsupport || this.$control.css({
  opacity: 0
    });
    var t = isNaN(this.setting.scrollto) ? this.setting.scrollto : parseInt(this.setting.scrollto);
    t = "string" == typeof t && 1 == jQuery("#" + t).length ? jQuery("#" + t).offset().top : 0, this.$body.animate({
      scrollTop: t
    }, this.setting.scrollduration)
  },
  keepfixed: function() {
     var t = jQuery(window),
      o = t.scrollLeft() + t.width() - this.$control.width() - this.controlattrs.offsetx,
      s = t.scrollTop() + t.height() - this.$control.height() - this.controlattrs.offsety;
    this.$control.css({
      left: o + "px",
      top: s + "px"
    })
  },
  togglecontrol: function() {
     var t = jQuery(window).scrollTop();
    this.cssfixedsupport || this.keepfixed(), this.state.shouldvisible = t >= this.setting.startline ? !0 : !1, this.state.shouldvisible && !this.state.isvisible ? (this.$control.stop().animate({
      opacity: 1
    }, this.setting.fadeduration[0]), this.state.isvisible = !0) : 0 == this.state.shouldvisible && this.state.isvisible && (this.$control.stop().animate({
      opacity: 0
    }, this.setting.fadeduration[1]), this.state.isvisible = !1)
  },
  init: function() {
    jQuery(document).ready(function(t) {

我已经改变了它,为我添加的新按钮工作但到目前为止没有运气。 [这是我到目前为止所得到的。] [2]

那么,我如何让新按钮像我网站上的按钮一样淡入淡出?有没有办法用我上面链接的代码来做呢?

由于

另外,抱歉有任何错误。我还在编码。

1 个答案:

答案 0 :(得分:0)

https://jsfiddle.net/71uncr2g/8/

试试吧。我现在正在做这样的事情。这是jQuery代码:

var amountScrolled = 300;

$(window).scroll(function() {
    if ( $(window).scrollTop() > amountScrolled ) {
        $('.fadebutton').fadeIn('slow');
    } else {
        $('.fadebutton').fadeOut('slow');
    }
});