滚动标题应按照jQuery中的指示滑动/向上滑动,但是,在移动iOS中,这不会发生并且标题在屏幕顶部抖动？
这适用于大型浏览器上的Chrome,Mozilla Firefox,Internet Explorer和Safari.
这是因为滚动顶部方法的错误使用而发生的吗？我该如何纠正？
jQuery(document).ready(function ($) {
var lastScrollTop = 0;
$(window).scrollTop(0);
$(window).on('scroll', function() {
var header = $('header');
var content = $('content');
var headerBg = $('.header-bg');
var headerCnt = $('.header-content');
var scrollTop = $(window).scrollTop();
var dynHeaderVisible = false;
if (lastScrollTop > scrollTop) {
if (scrollTop <= 400) {
headerBg.css("height", 0);
headerCnt.css('color', 'white');
} else {
headerBg.css("height", 80);
headerCnt.css("height", 80);
headerCnt.css('color', 'black');
}
} else {
// Down
if (scrollTop > 350) {
console.log ("hi");
headerCnt.css("height", 0);
headerBg.css("height", 0); …我是jQuery的新手,在我去的时候正在教自己,但我正在努力弄清楚如何指出在向上滚动时白色导航背景向上移动以显示面板1上的白色导航文本？
我正在使用bartaile.com作为灵感,我正在对bartaile的导航所做的更改是--->在用户滚动浏览导航隐藏的第一个面板后,只有当用户向上滚动时才会再次显示导航,面板1返回到白色导航背景向下滑动以隐藏和显示白色文本.
任何帮助或提示,以了解如何做到这一点将不胜感激!:-)
var lastScrollTop = 0;
$(window).on('scroll', function() {
var header = $('.header');
var stage0 = $('.stage-0');
var scrollTop = $(window).scrollTop();
if (scrollTop > lastScrollTop) {
// down scroll
if (scrollTop > stage0.offset().top + stage0.height()) {
header.addClass('hide');
}
} else {
// up scroll
if (scrollTop <= stage0.offset().top + stage0.height()) {
header.removeClass('headerBGchange headerLIchange');
} else {
header.removeClass('hide').addClass('headerBGchange headerLIchange BGupTranistion');
}
}
lastScrollTop = scrollTop;
});.header {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center; …我正试图将标题中的li项目并排排列.然而,当我用内联显示和左浮动定义ul&li时我想要实现的是不会发生li项目仍然垂直堆叠而不是水平并排？
* {
margin: 0;
padding: 0;
width: 100%;
margin: 0;
list-style: none;
text-decoration: none;
font-size: 1em;
font-family: Helvetica Neue, Helvetica,Arial,Sans-serif;
}
a {
background: transparent;
border: none;
letter-spacing: 0.15em;
text-transform: uppercase;
transition: .3s color;
transition: .3s height;
}
header {
display: block;
position: fixed;
height: 80px;
width: 100%;
}
.header-wrapper {
width: 100%;
height: 100%;
background: transparent;
}
.header-bg,
.header-content {
position: fixed;
top: 0;
left: 0;
width: 100%;
text-align: center;
}
.header-bg {
color: gray;
background: white;
border-bottom: …