JQueryで特定のクラスが存在していればAを、存在していなければBをみたいなことはしょっちゅうやっていますが、その方法です。クラスを動的に追加している場合などに重宝するコードです。
クラスがあるかどうかのチェックは、$(".class名").length で可能です。
下のコードは、ページをスクロールをした際に何か動的に生まれたクラスがあればA、存在していなければBのようなケース。
$(function() {
$(window).scroll(function () {
if($(".new-class").length){
ここにAのコードを書く
}
else {
ここにBのコードを書く
}
});
});
より具体的な例として、下にスクロールして何かクラスが現れたらサイトのロゴの画像を変えて、ページの先頭に戻ったらまた画像を元に戻すみたいな場合のコードを書きます。
$(function() {
$(window).scroll(function () {
if($(".new-class").length){
$("h1 > img").attr({"src":"スクロールした時の画像のパス"});
}
if($(window).scrollTop()==0){
$("h1 > img").attr({"src":"初期値の画像のパス"});
}
});
});