ここで初めて質問をします。 質問で検索しましたが、同様の問題は見つかりませんでした。addClass removeClass not working
ブラケットにbootstrap3という企業Webサイトを構築しています。私は物事がクロムとサファリの最新バージョンで動作するかどうかをチェックします。
JQuery addClassとremoveClassを使用してナビゲーションバーの高さを小さくして背景色を変更しようとしていますが、動作していないようです。 JQuery経由でCSSプロパティを変更すると動作します。私は背景色を変えることができます。 Jqueryで複数のCSSプロパティを変更しようとしましたが、うまくいきませんでした。私は背景色を変更することができます。
$(document).ready(function() {
$(window).scroll(function() {
if ($(window).scrollTop() > 50) {
$("#top-bar").addClass('animated-header');
} else {
$("#top-bar").removeClass('animated-header');
}
});
$("#clients-logo").owlCarousel({
itemsCustom: false,
pagination: false,
items: 5,
autoplay: true,
})
}); //this is the part doesn't work
$(document).ready(function() {
$(window).scroll(function() {
if ($(window).scrollTop() > 50) {
$("#top-bar").css("background-color", "#ef7c7c");
} else {
$("#top-bar").css("background-color", "transparent");
}
});
$("#clients-logo").owlCarousel({
itemsCustom: false,
pagination: false,
items: 5,
autoplay: true,
})
}); //this part works perfectly
#top-bar {
background: transparent;
color: #fff;
-webkit-transition: all 0.2s ease-out 0s;
transition: all 0.2s ease-out 0s;
padding: 30px 0;
height: 15%;
}
#top-bar .animated-header {
/*Background Color of nav bar when scrolled*/
background-color: #ef7c7c;
padding: 10px 0;
height: 10%;
-webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.1);
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.1);
}
<header id="top-bar" class="navbar-fixed-top animated-header">
<div class="container">
あなたの助けをありがとうございました!
ありがとうございます!大括弧でファイルのエラーをチェックする方法はありますか?私はそれが問題だったことを知らずに数週間のように書いてきました.... –
これはエラーではありません、これはちょうどタイプミスです、あなたはちょうどセレクターと混同されています。 – wrongway4you
しかし、エラーをチェックしたいのであれば、Sublime TextやAtomのようなプラグインを使ってコードを書いたり、エディタでコードを完全に理解したければIDE(Visual Studio、Intellij Idea、PyCharm ) – wrongway4you