- GoogleMapのiframeをユーザが自由に描画できる
- iframeのsrcパラメータに入力フォームの値を渡すことで、リアルタイムでの地図描画が可能
- ただし表示や動作の細かい制御はできない
javaScriptAPIに比べて、2,000,000/dayとリクエスト制限が緩い(2015年5月18日現在) 課金も現状ない様子
<?xml version="1.0" encoding="UTF-8"?> | |
<!DOCTYPE en-export SYSTEM "http://xml.evernote.com/pub/evernote-export2.dtd"> | |
<en-export> | |
<note><title>ノート作成用 デザインテンプレート</title><content><![CDATA[<?xml version="1.0" encoding="UTF-8"?> | |
<!DOCTYPE en-note SYSTEM "http://xml.evernote.com/pub/enml2.dtd"> | |
<en-note> | |
<div><br clear="none" /></div> | |
var fnc = { | |
// 電話番号機能(a:tel)をスマホの場合のみ有効化する | |
usableTel: function() { | |
/** | |
* PC, スマホでタグ自体を書き換える | |
* $.each()内での使用を想定 | |
*/ | |
var replaceFnc = function(index, elem) { | |
var tag = elem.tagName, | |
$self = $(elem), |
<a href="#" data-slide-trigger="A" data-slide-toggle="true">Aをクリックすると...</a> | |
<div class="js-slide-target" data-slide-target="A">Aが開きます!</div> | |
<a href="#" data-slide-trigger="B" data-slide-toggle="false">Bをクリックすると...</a> | |
<div class="js-slide-target" data-slide-target="B">Bが開きます!クリックしたものはremoveされるぞ</div> | |
<a href="#" data-slide-trigger="C" data-slide-toggle="true">Cをクリックすると...</a> | |
<div class="js-slide-target" data-slide-target="C">Cが開きます!</div> |
var breakPoint = 767; | |
/* 汎用的な関数をまとめて定義 */ | |
var utility = { | |
/** | |
* ウィンドウがスマホサイズ(ブレークポイントより小さい)かどうか | |
* @return {boolean} [規定した閾値以下であればtrue] | |
*/ | |
isSp: function(){ | |
// IE8以下はfalseを返す | |
if (!window.innerWidth){ |
<script src="https://maps.googleapis.com/maps/api/js"></script> | |
<div id="map"></div> |
/* スムーズスクロールのイベント設定 */ | |
var addSmoothScrollEvent = function() { | |
var clickEventHandler = function() { | |
var href = $(this).attr('href'); | |
// #headerが指定されていればトップと見なす | |
var target = (href === '#' + $header.attr('id')) ? 'html' : href; | |
$(target).velocity('scroll', {duration: 500, easing: 'ease-in'}); | |
return false; | |
}; | |
$('a[href^="#"]').on('click.smooth', clickEventHandler); |
// 追記 | |
// functionは外に出して、callback付きで制御した方が良さそう | |
var isClickable = true; | |
$('h1').on('click',function() { | |
if (isClickable) { | |
console.log('実行!'); | |
isClickable = false; | |
} else { | |
console.log('処理中です'); |