Skip to content

Instantly share code, notes, and snippets.

@k-ish
k-ish / index.html
Last active October 9, 2018 06:13
scroll highlight
<!-- スクロール位置によって、ハイライトする項目が変化 -->
<header>
<h1>Highlight Menu</h1>
<nav>
<ul>
<li class="current"><a href="#">Section1</a></li>
<li><a href="#">Section2</a></li>
<li><a href="#">Section3</a></li>
<li><a href="#">Section4</a></li>
@k-ish
k-ish / .htaccess
Last active October 9, 2018 06:31
404error ページの設定
ErrorDocument 404 /404.html
@k-ish
k-ish / .htaccess
Created October 9, 2018 06:40
ベーシック認証の設定
AuthUserFile /home/path../.htpasswd
AuthGroupFile /dev/null
AuthName "Input ID and Password."
AuthType Basic
require valid-user
<Files ~ "^.(htpasswd|htaccess)$">
deny from all
</Files>
@k-ish
k-ish / script.js
Created October 10, 2018 05:59
ヘッダー固定時のページ内リンクずれの位置修正
$(function(){
$('nav li a, .menu li a').click(function() {
var speed = 400;
var href= $(this).attr("href");
var target = $(href == "#" || href == "" ? 'html' : href);
var headerHeight = 100; //固定ヘッダーの高さを指定
var position = target.offset().top - headerHeight; //ターゲットの座標からヘッダの高さ分引く
$('body,html').animate({scrollTop:position}, speed, 'swing');
return false;
});
@k-ish
k-ish / index.html
Last active July 5, 2019 09:21
オーバーレイメニュー
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="style.css" media="all">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
@k-ish
k-ish / about-gulp.md
Created October 13, 2018 08:59
gulp の設定方法

Gulpインストール

サマリー

初期設定

  • node.js のインストール
  • npm のインストール
  • Gulp グローバルへインストール npm install -g gulp

プロジェクトフォルダ設定

  • Gulp ローカルへインストール(nodemoduleフォルダ) npm install --save-dev gulp
  • package.jsonファイルを生成 npm init -y
@k-ish
k-ish / gulpfile.js
Last active May 24, 2019 01:52
開発環境190524
const gulp = require('gulp'),
sass = require('gulp-sass'),
postcss = require('gulp-postcss'),
autoprefixer = require('autoprefixer'), // postcssの一部
mqpacker = require('css-mqpacker'), // postcssの一部
cssdeclsort = require('css-declaration-sorter'), // postcssの一部(並び替え)
pug = require('gulp-pug'),
plumber = require("gulp-plumber"), // 監視継続
notify = require('gulp-notify'), // 通知
imagemin = require("gulp-imagemin"),
@k-ish
k-ish / copy.js
Created December 12, 2018 07:48
コピーライト年度自動更新
var cp=new Date();
var now=cp.getFullYear();
document.write('Copyright &copy; '+now+' ウェブデザインカンパニー All Rights Reserved.');
@k-ish
k-ish / analytics.js
Last active May 17, 2019 09:03
analytics.js
/* Google Analytics用コード */
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'トラッキングIDをここに書く!', 'auto');
ga('require', 'displayfeatures');
ga('send', 'pageview');
@k-ish
k-ish / common.js
Last active June 10, 2019 09:30
外部ファイル読み込み
function writeHeader(rootDir){
$.ajax({
url: rootDir + "/header.html", //パスはcommon.jsが読み込まれたHTMLファイルが基準
cache: false, //キャッシュを利用するか(
async: false, //非同期で読み込むか
success: function(html){
html = html.replace(/\{\$root\}/g, rootDir);
document.write(html);
}