Skip to content

Instantly share code, notes, and snippets.

View maru0014's full-sized avatar

marumo maru0014

0 followers · 1 following
View GitHub Profile
@maru0014
maru0014 / column.css
Created November 4, 2015 07:21
レスポンシブ対応等幅リストCSS
@charset "utf-8";
/***********************************************************
レスポンシブ対応リストタグ等幅カラムスタイルシート
記述順：
スマートフォン
↓
タブレット@media screen and (min-width: 641px)
↓
PC@media screen and (min-width: 981px)
@maru0014
maru0014 / index.html
Created October 27, 2015 13:11
jQueryのloadメソッドでパーツを読み込み 1
<!DOCTYPE HTML>
<html lang="ja">
<head>
</head>
<body>
<div id="header">
タイトルロゴや画像<br>
グローバルメニューなど
</div>
@maru0014
maru0014 / index.html
Last active October 27, 2015 13:11
jQueryのloadメソッドでパーツを読み込み2
<!DOCTYPE HTML>
<html lang="ja">
<head>
<!-- jquery読み込み　Ver.1.8.3 -->
<script src="js/jquery.min.js"></script>
<script>
//共通パーツ読み込み
$(function() {
$("#header").load("header.html");
$("#side").load("side.html");
@maru0014
maru0014 / atom-sync-settings.md
Last active July 12, 2017 01:27
automatic update by http://atom.io/packages/sync-settings

Atom の設定を sync-settings で共有します。

@maru0014
maru0014 / smoothscroll.js
Created October 19, 2015 13:45
コピペでOK スムーズスクロール
<!-- jQuery本体の読み込み -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<!-- ＃リンクのスムーズスクロール -->
<script>
$(function(){
// #で始まるリンクをクリックしたら実行されます
$('a[href^=#]').click(function() {
// スクロールの速度
var speed = 400; // ミリ秒で記述
@maru0014
maru0014 / ベンダープレフィックス付きcalc.css
Created October 17, 2015 13:04
li.3col {
width : 33.33333% ; /* 未対応ブラウザ用フォールバック */
width : -webkit-calc(100% / 3) ;
width : calc(100% / 3) ;
}
@maru0014
maru0014 / 列を三等分calcファンクション.css
Created October 17, 2015 13:00
li.3col {
width : calc(100% / 3) ;
}
@maru0014
maru0014 / 列を三等分.css
Created October 17, 2015 12:52
li.3col {
width : 33.33333% ;
}
@maru0014
maru0014 / Android標準ブラウザでも背景画像が表示される（幅100%指定）.css
Last active October 13, 2015 08:40
Android標準ブラウザでも背景画像が表示される（幅100%指定）
//Android標準ブラウザでも背景画像が表示される（幅100%指定）
h2 {
background: url(image.jpg);
background-size: 100% 40px;
-webkit-background-size: 100% 40px;　/* Safari,Google Chrome用 */
-moz-background-size: 100% 40px;　/* Firefox用 */
-o-background-size: 100% 40px;　/* Opera用 */
}
@maru0014
maru0014 / Android標準ブラウザでも背景画像が表示される.css
Last active October 13, 2015 08:40
Android標準ブラウザでも背景画像が表示される
//Android標準ブラウザでも背景画像が表示される
h2 {
background: url(image.jpg) repeat-x;
background-size: 1px 40px;
-webkit-background-size: 1px 40px;　/* Safari,Google Chrome用 */
-moz-background-size: 1px 40px;　/* Firefox用 */
-o-background-size: 1px 40px;　/* Opera用 */
}