内联Javascript停止将类添加到元素

时间:2019-05-22 20:29:02

标签: javascript jquery html dom

嘿,我有一个内嵌的javascript代码,该代码将一个类添加到元素中并使其在屏幕中向上滑动。但是它突然停止工作了,我不知道为什么。这是HTMl和JS:

 $(window).scroll(function() {    
        var scroll = $(window).scrollTop();

        if (scroll >= 400) {
            $(".converter").addClass("atcbottomactive");
        } else {
            $(".converter").removeClass("atcbottomactive");
        }
    });
.converter {
	position: fixed; 
	height: 60px; 
	width: 100%; 
	bottom: -200; 
	background: #eeeeee; 
	transition: 1s;
	z-index: 10000;
}

.ccontent {
	display: inline-flex;
	width: 100%;
	padding: 10px 5%;
}

.atcbottomactive{
	bottom:0;
	transition: 1s;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div style="background: green; height: 1500px; width: 100%;"></div>
<div class="converter"><div class="ccontent">...</div></div>

这里是link

预先感谢:)

1 个答案:

答案 0 :(得分:1)

实际上,尝试在不包括JQuery的情况下使用它会给您错误。您可以使用“ JavaScript”轻松解决此问题,而无需使用jQuery。

Microsoft.Isam.Esent.Interop.EsentVersionStoreOutOfMemoryException: Version store out of memory (cleanup already attempted)
   at Microsoft.Isam.Esent.Interop.Api.Check(Int32 err)
   at Microsoft.Isam.Esent.Interop.Api.JetUpdate(JET_SESID sesid, JET_TABLEID tableid, Byte[] bookmark, Int32 bookmarkSize, Int32& actualBookmarkSize)
   at Microsoft.Isam.Esent.Interop.Update.Save(Byte[] bookmark, Int32 bookmarkSize, Int32& actualBookmarkSize)
   ...
var element = document.querySelector(".converter");

window.addEventListener('scroll', function() {

  var scroll = window.pageYOffset || document.documentElement.scrollTop;

  if (scroll >= 400) {
    element.classList.add("atcbottomactive");
  } else {
    element.classList.remove("atcbottomactive");
  }

});
.converter {
  padding: 20px 20px 200%;
  background: blue;
  color: white;
}

.converter.atcbottomactive {
  background: green;
}