Skip to content

Instantly share code, notes, and snippets.

@maru0014
maru0014 / column.css
Created November 4, 2015 07:21
レスポンシブ対応等幅リストCSS
View column.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
View index.html
<!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
View index.html
<!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");
View atom-sync-settings.md

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

@maru0014
maru0014 / smoothscroll.js
Created October 19, 2015 13:45
コピペでOK スムーズスクロール
View smoothscroll.js
<!-- 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; // ミリ秒で記述
View ベンダープレフィックス付きcalc.css
li.3col {
width : 33.33333% ; /* 未対応ブラウザ用フォールバック */
width : -webkit-calc(100% / 3) ;
width : calc(100% / 3) ;
}
View 列を三等分.css
li.3col {
width : 33.33333% ;
}
@maru0014
maru0014 / Android標準ブラウザでも背景画像が表示される(幅100%指定).css
Last active October 13, 2015 08:40
Android標準ブラウザでも背景画像が表示される(幅100%指定)
View Android標準ブラウザでも背景画像が表示される(幅100%指定).css
//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標準ブラウザでも背景画像が表示される
View Android標準ブラウザでも背景画像が表示される.css
//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用 */
}