Javascript 为什么我的粘条没有'；你不能完全使用safari和internet explorer吗？

/*粘性导航栏*/
window.onscroll=function（）{myFunction（）}；
var navbar=document.getElementById（“标题”）；
var sticky=navbar.offsetTop；
函数myFunction（）{
如果（window.pageYOffset>=粘性）{
navbar.classList.add（“粘性”）
}否则{
navbar.classList.remove（“粘性”）；
}
}
$（文档）.ready（函数（）{//检查滚动条的垂直位置
var scrollY=$（this.scrollTop（）；
//当用户刷新psge时
如果（滚动>0）{
//如果不是顶部，则通过添加class.isSticky更改不透明度
$（'#header'）.addClass（'isSticky'）；
}否则{
$（'#header'）.removeClass（'isSticky'）；
}
$（窗口）.on（'scroll'，function（）{
//uesr滚动时，检查滚动顶部位置
var scrollY=$（this.scrollTop（）；
如果（滚动>0）{
$（'#header'）.addClass（'isSticky'）；
}否则{
$（'#header'）.removeClass（'isSticky'）；
}
});
});
#标题{
显示器：flex；
证明内容：柔性端；
背景：rgba（0,1,31,1）；
-webkit过渡：后台0.5s易入易出；
-moz过渡：背景0.5s缓进缓出；
-ms过渡：背景0.5s缓进缓出；
-o型过渡：背景0.5s缓进缓出；
过渡：背景0.5s缓进缓出；
z指数：2；
位置：粘性；
排名：0；
左：0；
右：0；
}
#标题：isSticky{
背景：rgb（139139157,0.9）；
-webkit过渡：后台0.5s易入易出；
-moz过渡：背景0.5s缓进缓出；
-ms过渡：背景0.5s缓进缓出；
-o型过渡：背景0.5s缓进缓出；
过渡：背景0.5s缓进缓出；
}
#头衔{
边距：0自动0；
高度：20px；
边缘顶端：13px；
左侧填充：10px；
边框底部：1px纯色橙色；
垫面：1px；
垫底：35px；
弹性：1；
}
#导航栏{
显示器：flex；
证明内容：柔性端；
边框底部：5px实心橙色；
垫底：10px；
填充顶部：15px；
}
IMG.background{
显示：块；
左边距：自动；
右边距：自动；
z指数：1；
宽度：60%；
}
#导航栏a{
显示：块；
颜色：#FFF；
文本对齐：居中；
填充：10px 16px；
文字装饰：无；
字号：17px；
}
#导航栏a：悬停{
背景色：#ddd；
颜色：黑色；
}
#导航条a.激活{
背景：rgba（217,78,68,0.8）；
颜色：白色；
}
.粘的{
位置：固定；
排名：0；
宽度：100%；
}
.粘性+.内容{
填充顶部：60px；
}
身体{
字号：28px；
背景色：#00011f；
左边距：自动；
右边距：自动；
页边顶部：自动；
}
iframe{
宽度：100%；
}
h3{
字号：28px
}
/*accueil目录页*/
#小插曲{
填充：16px；
颜色：#000；
背景色：#e8f1fa；
高度：自动；
}
#发现{
显示器：flex；
证明内容：中心；
对齐项目：居中；
柔性包装：包装；
}
#研究{
显示器：flex；
证明内容：中心；
对齐项目：居中；
柔性包装：包装；
}
#内容{
填充：16px；
颜色：#000；
背景色：#e8f1fa；
高度：自动；
}
#文件{
保证金：5px；
}
img{垂直对齐：中间；}
/*幻灯片容器*/
迈斯利德斯先生{
显示器：flex；
证明内容：中心；
}
.mySlides>div{
弹性：0.40%；
}
.slideshow容器{
最大宽度：800px；
位置：相对位置；
保证金：自动；
边缘顶部：50px；
}
/*标题文本*/
.文本{
颜色：#F2F2；
字体大小：20px；
填充：8px 12px；
框大小：边框框；
}
/*数字文本（1/3等）*/
.numbertext{
颜色：#F2F2；
字体大小：12px；
填充：8px 12px；
}
/*点/子弹/指示器*/
多特先生{
高度：5px；
宽度：5px；
边际：0.2px；
背景色：#bbb；
边界半径：50%；
显示：内联块；
过渡：背景色0.6s；
}
.主动{
背景色：#717171；
}
/*褪色动画*/
.褪色{
-webkit动画名称：淡入淡出；
-webkit动画持续时间：1.5s；
动画名称：淡入淡出；
动画持续时间：1.5s；
}
html>
科兰普
«三维立体摄影系统的可视化̀生物和原理活动»

«应力的可视化效果取决于设定的基本频率»

«Ponts photoniques obtenus àpartir de deux composites dentiles de composition differencérenté»



并非所有IE版本都支持粘性，请参阅：

在狩猎旅行中，导航栏在跳跃，不会褪色

在Safari上不褪色，因为您使用的是RGBA，因为您将不透明度指定为0.9，但您使用的是RGB。所以与其说是
rgb（139，139，157，0.9）
，不如说是
rgba（139，139，157，0.9），因此：

#header.isSticky {
  background: rgba(139, 139, 157, 0.9);
    ...
}

跳转是因为当您的
标题变为
粘滞时，它的行为类似于位置
已固定
，并且下面的所有内容都是“跳转”到该位置，因为它变为可用。解决方法是在
.slideshow容器
中添加一个填充，然后将其放置在
标题
后面，应用负边距

.slideshow-container {
    ...
    padding-top: 120px; /* 50px plus header height */
    margin-top: -70px; /* header height */
}

这对你有意义吗？
发表一篇文章。不要链接到你的网站让我们检查。我做了对不起：-）完美的不透明性。它起作用了！顺便说一下，我不知道我该怎么跳。。。我尝试在.slideshow容器中应用您的代码，但它不起作用。如果我理解的话，我只有在滚动时才能将高度大小应用于.slideshow容器（标题后的第一个div），因为标题会变粘并释放其空间。是吗？是的，或者你可以在默认情况下使标题保持粘性。我如何做？只需将#标题的位置设置为：fixed