エレファンキューブリンク帳: HTML

ラベル HTML の投稿を表示しています。すべての投稿を表示

2018年8月10日金曜日

Swiper使用に不意にスライド遷移してしまうのを防ぐ

みなさん、カルーセルのライブラリ何使ってますか？

http://idangero.us/swiper/
このSwiperというのが、PCでもタッチデバイスでも動いて、APIも分かりやすく、なかなか使い勝手良いのだけど１つハマったので共有。

http://idangero.us/swiper/api/
APIリファレンス
オプションで、「allowTouchMove」をfalseにしたほうがよい。デフォルトのtrueのままでPCで操作していると、操作しているときに不意に別のスライドにジャンプしてしまうことがある。

2018年8月3日金曜日

HTMLでローカルファイルの読み込み、保存

HTML5 File APIでテキストファイルの入出力をします。
https://www.thewebflash.com/reading-and-creating-text-files-using-the-html5-file-api/

2018年7月13日金曜日

iOSではHTML5 audioの音量調整ができない

iOSでは、HTML5のvolumeプロパティを変更しても効かない。（ハードウェア/OS側の物理的なボリューム調整を使ってくれという意図。）
https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html#//apple_ref/doc/uid/TP40009523-CH5-SW10

On iOS devices, the audio level is always under the user’s physical control. The volume property is not settable in JavaScript. Reading the volume property always returns 1.

2018年2月17日土曜日

IE11 audioタグで playbackRate が適用されないことがある

IE11のaudioタグ実装で、Aの音声を再生後（endedイベント）Bの音声を再生、ということをやろうとしたら、Bの音声に playbackRateを設定してもなぜか反映されない現象発生。再現条件は不明。

以下のスクリプトを常時（ticker的なスクリプト内）実行することで対応。

if(audioObj.playbackRate && audioObj.playbackRate != audioRate){

audioObj.playbackRate = audioRate;

}

2017年10月30日月曜日

ページ読み込み中にローディング

http://gimmicklog.main.jp/jquery/278/
読み込みに時間がかかるときに、ブラウザならローディング中がわかるけど、Cordovaで囲むとわからないので、いれるほうが親切そう。

2017年8月3日木曜日

Android Chromeのステータスバーの色を変える

https://mechalog.com/android-statusbar

これ、知らなかった。

2017年4月28日金曜日

IE11でブランクに下線がつかない問題の解決

IE11で<u>□□□□□□</u>（□は、スペースです）と書くと、下線が描かれない。
それを解決するCSS

u {
text-decoration: underline;
white-space: pre;
}

参考
http://stackoverflow.com/questions/4513388/how-to-underline-blank-space-in-css

2017年3月11日土曜日

HTML data-*属性

HTMLの属性（attribute）として、data-* とついているものがよくありますが…
他の属性と違った取り扱いができるらしい（しらなかった！）

jQueryだと、
<tag data-abc="myValue">
に対して、
$(selector).data("abc")
で値が取得できます。
ふつうに属性取得するのは、
$(selector).attr("data-abc")

このデータの扱いについて、少し注意が必要そう。
http://qiita.com/Kta-M/items/2eda39750abd10df9801