当我的移动汉堡包菜单打开时,我使用JS添加CSS类,以防止在我的站点上滚动。
但是,使用盖茨比的<Link>组件进行内部链接时,当单击一个新的内部页面时,“无滚动”类将保持不变,移动菜单将关闭.最终的结果是呈现新的页面,但是滚动被锁定,汉堡包菜单无法访问。
我希望能够在点击Gatsby <Link>组件时执行JS,这样我就可以从适当的元素中删除“无滚动”类。
这是我的JS。
(function(){
var burger = document.querySelector('#burger_container'),
body = d
因此,我制作了一个响应式导航栏,并希望在按下导航栏的按钮时停止滚动。现在,当我按下汉堡按钮时,页面仍然可以在背景中滚动。我尝试将overflow-y:隐藏在.nav-active下的CSS中,但似乎效果不佳。 HTML: <!-- My Nav Bar buttons -->
<div class = "nav-links">
<a href = "index.html">A</a>
<a href = "abo
我正在为我网站的移动版开发汉堡包菜单。您可以确切地看到它在代码页上的工作方式:
正如你所看到的,你点击汉堡包菜单,带有链接的div向下扩展。如果滚动,div崩溃,菜单返回到它的初始状态。这是告诉div在滚动窗口时折叠的脚本:
$(window).scroll(function(event) //AUTOMATICALLY HIDES THE NAV WHEN SCROLLING STARTS
{
if($("#"+slideNavName).attr('class')=="revealed") //SEE IF YOUR NAV IS OPE
我使用此代码在用户滚动时播放视频(视频在用户停止滚动时停止播放),但我希望停止页面滚动,直到视频结束,并且不确定如何实现这一点。
(function() {
var window_height = $(window).height();
var document_height = $(document).height();
var video = $('.landing #video-bg').get(0);
var length = 19; //seconds
var start = window_height;
var end = d