Waypoints
http://imakewebthings.com/waypoints/
jQuery 2020.10.9
jQuery 2020.10.9
Waypoints
http://imakewebthings.com/waypoints/
HTML jQuery WordPress 2020.4.24
<script> jQuery(document).ready(function($) { //PC環境の場合 if (window.matchMedia('(min-width: 768px)').matches) { //切り替える画面サイズ $.ajax({ url: '<?php echo esc_url( get_template_directory_uri() ); ?>/js/pc.js', dataType: 'script', cache: false }); //スマホ環境の場合 } else { $.ajax({ url: '<?php echo esc_url( get_template_directory_uri() ); ?>/js/sp.js', dataType: 'script', cache: false }); }; }); </script>
.my-element { min-height: 100vh; /* 変数をサポートしていないブラウザのフォールバック */ min-height: calc(var(--vh, 1vh) * 100); }
const setFillHeight = () => { const vh = window.innerHeight * 0.01; document.documentElement.style.setProperty('--vh', `${vh}px`); } let vw = window.innerWidth; window.addEventListener('resize', () => { if (vw === window.innerWidth) { // 画面の横幅にサイズ変動がないので処理を終える return; } // 画面の横幅のサイズ変動があった時のみ高さを再計算する vw = window.innerWidth; setFillHeight(); }); // 初期化 setFillHeight();
jQuery 2019.7.11
<script> <!-- window.onload = function() { var now = new Date(); var start = new Date('2001/1/1 0:00:00'); // 表示開始日時 var end = new Date('2020/12/31 23:59:59'); // 表示終了日時 if ( start < now && now < end ) { document.getElementById("campaign").style.display="block"; } } --> </script> <div id="campaign" style="display: none;"> ここに表示させたい内容を書き込む </div>
jQuery 2018.6.10
jQuery 2018.5.26
https://sakic.jp/blog/web/smooth-scroll
$(function () { // 全てのアンカータグを対象にする $('a').click(function (e) { var anchor = $(this), href = anchor.attr('href'), pagename = window.location.href; // 現在のurlのハッシュ以降を削除 pagename = pagename.replace(/#.*/, ''); // リンク先のurlから現在の表示中のurlを削除 href = href.replace(pagename, ''); if (href.search(/^#/) >= 0) { // 整形したリンクがページ内リンクの場合はページ内スクロールの対象とする // 通常の遷移処理をキャンセル e.preventDefault(); var speed = 500; // 前段階で整形したhrefを使用する // var href= $(this).attr("href"); var target = $(href == "#" || href == "" ? 'html' : href); var position = target.offset().top; $("html, body").animate({ scrollTop: position }, speed, "swing"); // ロケーションバーの内容を書き換え location.hash = href; return false; } }); });
jQuery 2017.10.30
使い方はとてもかんたんです。
1. 上のページから、「jquery.rwdImageMaps.min.js」をダウンロードします。
2. コードを貼り付けておしまい。
<script src="js/jquery.rwdImageMaps.min.js"></script> <script> $(document).ready(function(e) { $('img[usemap]').rwdImageMaps(); }); </script>