Google Maps APIをコピペで使い倒せ！Web初心者でもカスタマイズできるgmaps.js | Page 2 of 3 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Context menu： 右クリックをカスタマイズする 地図上での右クリック（コンテキスト）メニューをカスタマイズすることができます。表現の幅が広がりますね。 Map Types： 表示形式を変更する 航空写真やOpen Street Mapのように表示させることもできます。Google Mapsらしさを出したくないときに便利かもしれません。 Geocoding： ジオコーディング（住所から緯度経度への変換） 座標を覚えていなくても住所でジオコーディングができるのは便利ですね。ジオコーディング単体では色々なAPIがありますが、その中でもこれは使いやすくて感動しました。 Routes： 移動ルートの表示 Google Mapsの行き先検索が使えます。曲がり角や信号などステップごとに描画することもできます。 KML layers： KMLファイルを読み込める KMLという地図情報をまとめたx
[JavaScript] zeroclipboard を使って js だけでクリップボードにコピーする方法 - Qiita
runstant でボタンによる short url のコピー機能を実現するにあたり, 色々調べたら zeroclipboard とかいうライブラリに行き着きました. わりと使いやすいのに日本語で書かれた最新版の使い方がなかったので 備忘録がてらまとめてみました. zeroclipboard とは? ブラウザ上で js を使ってコピーを実現するためのライブラリです. 内部的には flash を使っているみたいです. github サンプル 最小サンプルです. サンプル クリックするとクリップボードにテキストがコピーされているのが 分かるかと思います. コード html html は下記のような感じです. zeroclipboard は cdnjs 経由でサクッと読み込んでいます. ボタンを押した際にコピーしたいテキストをボタンの data-clipboard-text 属性に入れておきます
![[JavaScript] zeroclipboard を使って js だけでクリップボードにコピーする方法 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/7597223774ad9705c96ea954e57081b5c6762445/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JTVCSmF2YVNjcmlwdCU1RCUyMHplcm9jbGlwYm9hcmQlMjAlRTMlODIlOTIlRTQlQkQlQkYlRTMlODElQTMlRTMlODElQTYlMjBqcyUyMCVFMyU4MSVBMCVFMyU4MSU5MSVFMyU4MSVBNyVFMyU4MiVBRiVFMyU4MyVBQSVFMyU4MyU4MyVFMyU4MyU5NyVFMyU4MyU5QyVFMyU4MyVCQyVFMyU4MyU4OSVFMyU4MSVBQiVFMyU4MiVCMyVFMyU4MyU5NCVFMyU4MyVCQyVFMyU4MSU5OSVFMyU4MiU4QiVFNiU5NiVCOSVFNiVCMyU5NSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9YmVkMzA0ZTgxYjMxYmIyMDE4MDYxNTExOGU3Mzk2MjQ%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwcGhpJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1hNzMyODE2YjRmOTNiOTE5N2U1YjI1NGNlZGNmMGY1OA%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D99b3974b5a3f9b3074210fb0cbacf59d)
Modernizr: the feature detection library for HTML5/CSS3
MENURespond to your user’s browser features.Modernizr tells you what HTML, CSS and JavaScript features the user’s browser has to offer.Add your detects Development build What is Modernizr?It’s a collection of superfast tests – or “detects” as we like to call them – which run as your web page loads, then you can use the results to tailor the experience to the user. Why do I need it?All web develope
タスクランナーgulp.js最速入門 - id:anatooのブログ
相変わらず仕事ではデザインやりつつJavaScript書いている。 タスクランナーとしてGrunt.jsを使っていたけれども、使ううちに段々不満がでてきた。遅かったり、記述が冗長になりがちでつらかったので最近になってgulpに乗り換えた。 gulpは良い。タスクは自動的に並列に実行され、かつストリームで処理されるので速いし、タスクの記述もストリームベースの書き方のおかげでGrunt.jsに比べるとだいぶ短くなる。 ただ、そこらにあるgulpをちょっと試しただけの日本語の記事やドキュメントをみてても実際のプロジェクトで使えるレベルまでの知識を得られず学習に一日かかった。 この記事では、gulpをまともに使えるようになるまでに必要な知識を書く。 導入とHelloWorld まずは導入。npmからgulpをインストールする。 $ npm install gulp -g $ gulp -v [gu
morris.js - SVGで手軽に綺麗なグラフを描くJavaScriptライブラリ MOONGIFT
管理画面などに格好いいグラフがあるとテンションがあがりますよね。とは言えグラフを表示するというのは意外と面倒で、ついつい後回しになってしまいがちです。 そこで手軽に格好いいグラフを描けるライブラリとしてmorris.jsを紹介します。 morris.jsの使い方 morris.jsはまずJavaScript/スタイルシートを読み込みます。 <link rel="stylesheet" href="http://cdn.oesmith.co.uk/morris-0.4.3.min.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-m
spin.js
Share it! If checked, the option values will be stored in the URL so that you can easily share your settings. Features No images No dependencies Highly configurable Resolution independent Uses CSS keyframe animations Works in all major browsers Includes TypeScript definitions Distributed as a native ECMAScript module MIT License Spin.js dynamically creates spinning activity indicators that can be
jQuery treeView
Pagecode Other demos Large Tree Demo Prerendered Large Tree Demo Async Tree Demo Simple Tree Demo, famfamfam theme (no lines) Sample 0 - navigation Item 1 Item 1.0 Item 1.0.0 Item 1.1 Item 1.2 Item 1.2.0 Item 1.2.0.0 Item 1.2.0.1 Item 1.2.0.2 Item 1.2.1 Item 1.2.1.0 Item 1.2.2 Item 1.2.2.0 Item 1.2.2.1 Item 1.2.2.2 Item 2 Item 2.0 Item 2.0.0 Item 2.0.0.0 Item 2.0.0.1 Item 2.1
jQuery contextMenu (2.x)
Fork on GitHub Documentation Register new contextMenu Update contextMenu state Options (at registration) selector items appendTo trigger reposition delay autoHide zIndex className classNames animation events position determinePosition callback build Register new contextMenu To register a new contextMenu: Note: For SVG support use jQuery >= 1.12|2.2 $.contextMenu( options ); Update contextMenu stat
[JS]jQueryのプラグイン100選 -2012年総集編
2012年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年目立ったのは、やはりレスポンシブ、そしてCSS3アニメーションでしょうか。 スライダーやギャラリー系もレスポンシブ・アニメーション対応、ナビゲーションやPinterst風のレイアウトなど、多くのプラグインにそれら二つの要素が組み合わさっています。 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 ナビゲーション関連 レイアウト関連 レスポンシブ関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連
Jquery Mobile Drag And Drop - Steve Fenton : The Internet, Web Development, JavaScript, Photography
The Internet, Web Development, JavaScript, Photography Quick Links Visit the jQuery Mobile Drag And Drop project hub, which has a demonstration and download for this plugin on JS Plugins JavaScript Plugin Library.Mobile Drag And Drop Demonstration. Description The jQuery Mobile Drag And Drop project is a plugin for the jQuery JavaScript Framework, which provides a drag and drop interface on deskt
How to Make a Digital Clock with jQuery and CSS3
It all started last week when I saw this pretty dribbble shot. I immediately felt the urge to convert it into a working clock and share it with Tutorialzine's readers. If you'd like to learn how I made it, read on! Update: The second part of this tutorial is now live! There we are adding support for setting alarms with HTML5 audio. Read it here. The Markup The clock doesn't need a lot of HTML. Thi
FlipClock.js
Why FlipClock.js? So why use this library when there are many others with the same name? Well, this library was created because the other solutions weren’t abstract enough to provide a deep level of customization without rewriting the code. (Besides the domain was available, who could pass it up?). Some libraries have a huge cascade of conditionals, while others simply hard-code too much into thei
アドインなしで実現可能！ ドラッグ＆ドロップを使いこなそう
HTML5のDrag and Drop APIは、Insider.NETの読者諸氏ならば習得が容易なはずだ。なぜなら、ドラッグ＆ドロップの実装方法が.NET FrameworkのWindowsフォーム・アプリケーションのそれと類似しているからだ。 HTML 5のDrag and Drop APIの実装方法は「ドラッグ操作」と「ドロップ操作」に切り分けて考える必要があるが、この考え方はずばりWindowsフォーム・アプリケーションのそれと同様である。これは、Drag and Drop APIの設計にマイクロソフトが大きな影響を与えている点に由来している。 WHATWG（Web Hypertext Application Technology Working Group）がHTML5の仕様策定を進める際、「先進的な機能を実装しているブラウザの挙動を規格化する」という基本理念があった。マイクロソ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Video Delivery | Stunning Video on Any Screen | JW Player
Freeze Header | Brent Muir
Tutorial: How to Make a Digital Clock with jQuery & CSS3
DataTables | Javascript table library
GitHub - mmurph211/Grid: HTML-based table with fixed headers, fixed footers, fixed left columns, row selection, sorting and more.
Google Maps Platform のドキュメント | Maps Static API | Google for Developers
https://groups.google.com/forum/#!msg/google-maps-api-japan/kG6ZsppCo_o/JkhRe_P81OEJ