カッコよくカスタマイズされたグーグルマップをモーダル表示させてみよう | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうもです、フロントエンドエンジニアのはやちです( ˘ω˘)✌ こないだ「ファイナルファンタジーX HD Remaster」をクリアしまして、マッコリ飲みつつ夜中4時頃エンディングに感動、号泣しとりました(◞‸◟) どうでもいいですね✌(´ʘ‿ʘ｀)✌ さて、今回は「JavaScriptが苦手なあなたへ！グーグルマップを簡単にカッコよくカスタマイズする方法」という記事でご紹介したマップの実装に、モーダルを実装するプラグイン「colorbox」を使用して応用したものを作ってみました✌(´ʘ‿ʘ｀)✌ 以下、ご紹介させていただきますね( ˘ω˘) colorbox http://www.jacklmoore.com/colorbox/ 実装 それでは実装方法を解説していきます( ˘ω˘)☝ HTML モーダルを起動させたいボタンとモーダルウィンドウを用意してあげましょう。 モーダルウィンドウは
Free How-To Tutorials. Learn Everything Today | Envato Tuts+
Discover over 22,990 free how-to articles and tutorials. Millions of students shape their future with our free tutorials every month. What would you like to learn? With these free tutorials, you can learn to master Photoshop actions, give better PowerPoint presentations, or get the most out of WordPress. Or maybe you want to brush up on your web design skills or discover how to start a business? Y
Free How-To Tutorials. Learn Everything Today | Envato Tuts+
Discover over 22,990 free how-to articles and tutorials. Millions of students shape their future with our free tutorials every month. What would you like to learn? With these free tutorials, you can learn to master Photoshop actions, give better PowerPoint presentations, or get the most out of WordPress. Or maybe you want to brush up on your web design skills or discover how to start a business? Y
Google Maps API V3 での細かな設定 | バシャログ。
最近だんだん暖かくなってきて嬉しい kimoto です。今日は啓蟄ということで、冬眠から覚めた虫も這い出てくるそうです。 さて、前回書いた Google Map API V3 ですが、前回は基本的なことをざっと紹介しました。 今回は、そこからちょっとだけ踏み込んで、よくある設定を簡単にご紹介します。 マウスホイールでのズーム デフォルト設定だと、マウスホイールで縮尺が変更になります。 ホイールで拡大縮小ができるのは便利といえば便利なのですが、ページをスクロールしようとしてるのに、マップにポインタが重なった瞬間にページがスクロールせずマップが縮小されて行ったりします。 これは意外と不便なので場合によってはオフにした方が良いでしょう。 google.maps.event.addDomListener(window, 'load', function() { var map = document
そろそろ確認！Google Map API V3 への移行は済んでますか？ | バシャログ。
寒い！最近の状況を説明するにはひと言で十分。 寒い！！kimoto です。 Google Map を自分のサイトに埋め込めることができる Google Maps API。 現在の最新バージョンは v3 なのですが、一つ前の v2 のサポートが今年の5月に切れます。 （v2 のマニュアルにも注意書きがあります） ※ 2/26追記：正確にはサポートが切れたのは2010年の5月で、2013年の5月までは動作を保証する、という事だそうです。つまり、それ以降は動作の保証が無くなるということですね。 もし API を利用している方はバージョンが幾つか確認し、v2 であれば早急に v3 に移行することをおすすめします。 てことで、v3 の設置の仕方を簡単に説明しようとおもいます。 読み込み 読み込むコードはこちら。 <script type="text/javascript" src="http://m
Google マップ JavaScript API V3 まとめ
Home Google マップ JavaScript API V3 まとめ Google マップ JavaScript API V3 まとめ 地図コンテンツ作成とカスタマイズ例です。現在グーグル Maps Javascript API のバージョンは「V3」で、Nexus などのタブレットや Android スマートフォンにも適しています。 以下のほか、ブログも参照して下さい。このページに未掲載のマップが多数あります。 V2は2010年5月19日、正式に廃止されています。Google はV3への移行（Google Geo Developers Blog: GoV3: It's time to Upgrade）を奨めています。2013年11月19日以降（機能により）使えなくなっています。 2013年5月、ラベル類が更新されました。javascript の冒頭に google.maps.vis
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Coding Methodology | CFニュース | CODING FACTORY - コーディング専門サービス
AKINOBU MAEDA | 前田晃伸
Code Tutorials | Envato Tuts+