// JavaScript Document $(function () { //--------------------------------------------- // ハンバーガーメニュー開閉 //--------------------------------------------- $(document).ready(function () { $(".toggle").click(function () { $(this).toggleClass("active"); // ボタンのアイコンをアクティブに切り替える $(".nav").toggleClass("show"); // サイドバー(メニュー)の表示・非表示を切り替える }); //ページ内リンククリック時にハンバーガーメニューを閉じる $(".nav a[href]").on("click", function () { $(".toggle").trigger("click"); }); }); //--------------------------------------------- // SP閲覧時のみ電話番号にリンクを付ける //--------------------------------------------- var ua = navigator.userAgent; if (ua.indexOf("iPhone") > 0 || ua.indexOf("Android") > 0) { $(".tel-link").each(function () { var str = $(this).text(); $(this).html( $("") .attr("href", "tel:" + str.replace(/-/g, "")) .append(str + "") ); }); } //--------------------------------------------- // 外部リンクを別ウィンドウで開く //--------------------------------------------- $("a[href^=https]") .not('[href*="' + location.hostname + '"]') .attr("target", "_blank"); $("a[href^=http]") .not('[href*="' + location.hostname + '"]') .attr("target", "_blank"); //--------------------------------------------- // スムーズスクロール //--------------------------------------------- //#を含むリンクが対象 $('a[href^="#"]').click(function () { var speed = 600, href = $(this).attr("href"), //href="#"ならページトップ(html)へ href="#"以外ならhrefの指定先へ target = $(href == "#" || href == "" ? "html" : href), position = target.offset().top; $("body,html").animate({ scrollTop: position }, speed, "swing"); return false; }); //--------------------------------------------- // pagetopボタン スクロールでフェードイン //--------------------------------------------- // 300pxスクロールしたらpagetopボタンを表示する var topBtn = $("#Randam"); topBtn.hide(); $(window).scroll(function () { if ($(this).scrollTop() > 300) { topBtn.fadeIn(); } else { topBtn.fadeOut(); } }); }); //--------------------------------------------- // スクロールで要素を表示 //--------------------------------------------- function showElementAnimation() { var element = document.getElementsByClassName("js-animation"); if (!element) return; // 要素がなかったら処理をキャンセル var showTiming = window.innerHeight > 768 ? 200 : 40; // 要素が出てくるタイミングはここで調整 var scrollY = window.pageYOffset; var windowH = window.innerHeight; for (var i = 0; i < element.length; i++) { var elemClientRect = element[i].getBoundingClientRect(); var elemY = scrollY + elemClientRect.top; if (scrollY + windowH - showTiming > elemY) { element[i].classList.add("is-show"); } else if (scrollY + windowH < elemY) { // 上にスクロールして再度非表示にする場合はこちらを記述 element[i].classList.remove("is-show"); } } } showElementAnimation(); window.addEventListener("scroll", showElementAnimation);