// JavaScript Document $(function() { //--------------------------------------------- // ハンバーガーメニュー開閉 //--------------------------------------------- $(document).ready(function() { $(".toggle").click(function() { $(this).toggleClass("active"); // ボタンのアイコンをアクティブに切り替える $(".nav").toggleClass("show"); // サイドバー(メニュー)の表示・非表示を切り替える }); //ページ内リンククリック時にハンバーガーメニューを閉じる $('.nav a[href]').on('click', function() { $('.toggle').trigger('click'); }); }); //--------------------------------------------- // 無限ループスライド //--------------------------------------------- function shuffleContent(container) { var content = container.find("> *"); var total = content.length; content.each(function() { content.eq(Math.floor(Math.random() * total)).prependTo(container); }); } shuffleContent($("#main_slide_01")); shuffleContent($("#main_slide_02")); $('.main_slide').infiniteslide({ //オプションをここに設定していきます。 //'height': 200, 'speed': 75, 'direction' : 'left', 'pauseonhover': false, 'responsive': true }); //--------------------------------------------- // 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 elemY) { element[i].classList.add('is-show'); } else if(scrollY + windowH < elemY) { // 上にスクロールして再度非表示にする場合はこちらを記述 element[i].classList.remove('is-show'); } } } showElementAnimation(); window.addEventListener('scroll', showElementAnimation);