Corredor

ウェブ、プログラミングの勉強メモ。

HTML

Geolocation API を使って JavaScript だけで位置情報を取得する

HTML5 Geolocation: Bringing Location to Web Applications作者: Anthony T. Holdener III出版社/メーカー: O'Reilly Media発売日: 2011/05/24メディア: Kindle版この商品を含むブログを見る Cordova アプリで位置情報を取得する際は cordova-background-ge…

iOS Safari でフルスクリーンモードにするページのタイトルを変更する

Mac Fan 2017年10月号 [雑誌]出版社/メーカー: マイナビ出版発売日: 2017/08/29メディア: Kindle版この商品を含むブログを見る 最近 (今頃?) マイブームな iOS Safari のフルスクリーンモード。任意の Web ページを「ホームに追加」したときの挙動を Web ペ…

iOS Safari から追加したフルスクリーンモードアプリのステータスバーの表示仕様を変える

サファリ (しかけえほん)作者: キャロルカウフマン,ダンケイネン,Carol Kaufmann,Dan Kainen,きたなおこ出版社/メーカー: 大日本絵画発売日: 2013/07/16メディア: 大型本この商品を含むブログを見る 前回紹介した、apple-mobile-web-app-capable による「ウ…

iOS Safari で Web ページを「ホームに追加」した時にフルスクリーン表示にする

Safari(サファリ) 2017年 11 月号出版社/メーカー: 日之出出版発売日: 2017/09/23メディア: 雑誌この商品を含むブログを見る iPhone などの Safari で任意の Web ページを開いている時に、下部のメニューから「ホームに追加」という項目を選択できる。コレを…

自サイトの開発環境を作った

Webアプリエンジニア養成読本[しくみ、開発、環境構築・運用…全体像を最新知識で最初から! ] (Software Design plus)作者: 和田裕介,石田絢一(uzulla),すがわらまさのり,斎藤祐一郎出版社/メーカー: 技術評論社発売日: 2014/04/15メディア: 大型本この商品を…

Cordova アプリでサクサク動く Google Map を実現する「cordova-plugin-googlemaps」

Google API Expertが解説する Google Maps APIプログラミングガイド作者: 勝又雅史,古籏一浩,石丸健太郎,安藤幸央出版社/メーカー: インプレス発売日: 2011/12/02メディア: 単行本(ソフトカバー)購入: 2人 クリック: 69回この商品を含むブログ (8件) を見…

はてなブログでページの1つ目の記事末尾にだけ AdSense 広告を挿入する JavaScript を作った

はてなブログは各記事の下部に任意の HTML コードを仕込めるが、これはトップページやカテゴリページなどにも有効なエリアなので、ココに Google AdSense 広告のコードを埋め込んでしまうと、記事ごとに AdSense 広告が掲載されるようになってしまう。 2016…

input[type="file"] のデザインを簡単に変える方法

ファイルを選択する input[type="file"] は、大抵テキストボックスとボタンで構成されているが、それらを個別にデザイン変更したりすることができない。 そこで、このファイル要素を label 要素で囲み、その中で別にボタンを作ってやることで、簡単にデザイ…

はてなブログで独自のシェアリンク・フォローボタンを作る HTML・CSS

前回の記事で、はてなブログ公式プラグインではなく、独自のシェアリンク・フォローボタンを作って差し替えたら、ページの表示速度が高速化したという話をした。 neos21.hatenablog.com この独自リンクの作り方を紹介する。 シェアリンク このブログに置いて…

ブラウザのステータスバーに遷移先 URL を表示しないようにできるか

社内で「ブラウザのステータスバーに遷移先 URL を表示しないようにしたい」というバカげた要件が出てきていて解決方法を探っているチームがいて、数日迷っていたので以下の StackOverflow を見せてみた。 参考:javascript - HTML - overRide statusbar lin…

iPhone 上で HTML とか CSS とか JS とかをコーディングして動作確認できるアプリ

App Store でプログラミング言語名で検索すると、大抵の言語は実行環境付きのエディタアプリが存在する。 たとえば Java … JVM Programming Language - Learn & Programs Compiler ※このアプリの作者 Yauheni Shauchenka さんはいろんな言語のエディタを出し…

textarea 要素内の placeholder 属性で改行するには

前回の記事で placeholder 属性というものを紹介した。 neos21.hatenablog.com placeholder 属性は1行テキストボックスだけでなく、テキストエリアにも使える。そして、テキストエリアでも使えるということは、プレースホルダの文言も改行できるのではないか…

placeholder 属性でテキストボックスにヒントを書く

HTML5 で、placeholder 属性というものが追加されている。これはフォーム部品の初期値を指定するようなイメージだが、value 属性と違って、任意のテキストが入力されると非表示になる、いわばフォーム部品のヒント文言を書くための属性だ。 <input type="text" placeholder="電話番号を入力してください"> Placeholder と…

懐かしの marquee 要素を CSS3 で再現する

あの頃よく使っていた懐かしの HTML タグを思い出す企画。 第1弾は marquee 要素。 marquee 要素って? テキストを電光掲示板のようにスクロール表示させる要素。元々は IE が独自に導入したで、IE4 あたりから使えていたので、90年代のインターネットを彩る…

HTML5 における空要素の閉じ方

やっと Web 関連のネタ書くよー HTML5 における空要素 (br 要素や hr 要素など、終了タグが不要な要素) の閉じ方は、てっきり /> でないとダメかと思っていた。でもどうやら > で良いようだ。 参考:WHATWG FAQ - 日本語訳 - HTML5.JP 空要素は /> で閉じる…