jquery: スマホでの閲覧の場合のみ、フェードイン/アウトを適用させたい。

Question

タイトルの件ですが、お問い合わせボタンをPCの場合はそのまま表示して、スマホの場合でのみjqueryが適用される（スクロールの長さに応じてボタンがフェードイン/アウトする形）にしたいのですが、うまくいかないので解決方法を教えていただけないでしょうか。

現状ですが、

//contactボタン
$(function() {
    var topBtn = $('.contact');
    topBtn.hide();  
    //スマホ時にスクロールが600に達したらボタン表示
    var windowWidth = $(window).width();
    var windowSm = 767;
    if (windowWidth <= windowSm) {
    $(window).scroll(function () {
        if ($(this).scrollTop() > 600) {
        //ボタンの表示方法
            topBtn.fadeIn();
        } else {
        //ボタンの非表示方法
            topBtn.fadeOut();
        }
    });
    }
});

このような記述をしていて、contactボタンがPC/スマホどちらでもエフェクトが適用されません。
（ちなみに別の問題なのかわからないのですが、chromeでキャッシュの消去とハード再読み込みをすると、PCとスマホどちらでもエフェクトが適用されますが、再度ブラウザを更新するとまたエフェクトが適用されなくなります。）

お手数ですが解決方法を教えていただけないでしょうか。

Answer 1

動くサンプル：https://jsfiddle.net/06cdjhzj/

---

とりあえずChromeで動きましたよ。

Comments

[juke-footwork]

ご回答ありがとうございますmm

jqueryはまったく同じ記述しているんですが、やはりダメです。。
htmlかcssに問題があるんですかね..？

[kei344]

サンプルは動きましたか？動くのであればHTMLの構造がおかしいか、CSSでの指定に問題があるかどちらかでしょうね。

タグの対応（閉じタグ忘れなど）や ”” の閉じ忘れなどがないか、jQueryの呼び出しに失敗していないかなど1つずつチェックしてみてください。

[juke-footwork]

すみませんコメントの方にいま気がつきました、失礼しました。

アドバイスありがとうございます。HTMLとCSS、それぞれ確認してみます。
ありがとうございます。

[juke-footwork]

反応が遅くなってしまいすいません！無事解決できましたmm
（こちらの勘違い・認識ミスでした。。）

サンプルまで作成していただき大変助かりました。
ありがとうございました！