手書きアイコン素材（商用無料）

http://handdrawngoods.com/freebies/

JavaScriptで、より偏りのない乱数を発生させる

Mersenne Twister in JavaScript
https://magicant.github.io/sjavascript/mt.html

CSS TIPSあれこれ

文字列の折り返しをせず、...で省略する
text-overflow: ellipsis;
https://tech.recruit-mp.co.jp/front-end/tips-ellipsis/

iOS divのoverflow:scrollでスクロールできるようにする＆それをスムーズにする
-webkit-overflow-scrolling: touch;
https://qiita.com/YukieKasai/items/2bd8b585802116c8be66
http://phiary.me/css-tips-overflow-scrolling-smooth-scroll/

Mac、iOSだけでmp3が再生されないとき！

HTML5のオーディオ再生、Mac、iOSだけでmp3が再生されないときは、再エンコードしてみる。
変なビットレート値だとなんのエラーも出ず、ただ再生されないことがある。

JavaScript CSVパーサー

いちばん優秀そうなCSVパーサー
https://www.papaparse.com/

いままでEXCELでデータ編集する場合は、Unicodeテキスト→UTF-8保存（Firefox対応）とすることが多かったですが、Excelの新バージョン（2016から？）では、UTF-8 CSVが書き出せるので、これを標準にしていこうと思う。

F2 モバイル向けグラフライブラリ

F2
https://antv.gitbook.io/f2/

モバイルに特化したインタラクティブなグラフが作れるライブラリ。
パンでの移動やピンチイン・ピンチアウトでの拡縮にも対応している。
Canvasに描画するかたち。

自動クリックするフリーソフト

おーとくりっか～
https://forest.watch.impress.co.jp/docs/review/1103534.html

特定の案件では便利かと。

jQueryでスクロール最下部判定

いろいろ書き方があるが、ここが分かりやすく、最新版jQueryでも動いた
https://blog.toshimaru.net/jquery-bottom-scroll/

動的にimgタグで配置した画像の読み込みチェック

//画像読み込み確認
function imageChecker(){
var imgLoaded=0;
var imgTotal=0;
$('.swiper-wrapper img').each(function(){
imgTotal++;
if(0<$(this)[0].naturalHeight){
imgLoaded++;
}
});
if(imgLoaded == imgTotal){
$('.swiper-wrapper').css('opacity', 1);
}else{
setTimeout(function(){
imageChecker();
},100);
}
}

jQuery使用。

width()やheight()は、CSSで設定された値が返ってくるだけなので、naturalHeightを使う。

参考にしたサイト

https://stackoverflow.com/questions/1832907/is-there-any-way-to-read-out-the-naturalwidth-of-an-image-with-jquery

iSpring 文字化けっぽくなる場合の留意点

iSprringで書き出す際に文字化けっぽくなることがある。

有効な対策として、以下２つを設定する。

• iSpringのパブリッシュ設定「Advanced」の中の「Extended font compatibility」にチェックをいれる
• PowerPointの「デザイン」「フォント」で日本語フォント、英語フォントともに「メイリオ」にする

※なお、iSpringは、フォントによって崩れがおきるので「メイリオ」を推奨する

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

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

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

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

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

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

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.

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

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

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

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

audioObj.playbackRate = audioRate;

}

Adobe Animate CC HTML書き出しの読み込み進捗を表示する

https://qiita.com/tsunet111/items/33264aa4cd092708d9f1

Shift JIS でURLエンコードしたい

あるURLにShiftJISでURLエンコードする必要があり見つけたライブラリ

http://polygon-planet-log.blogspot.jp/2012/04/javascript.html

内部UTF-8でSJIS URLエンコードした文字列にする

function sjisencode(_str){
var utf16arr = _str.split('').map(function(c) { return c.charCodeAt(0); });
var utf8arr = Encoding.convert(utf16arr, 'UTF8', 'UNICODE');
var sjisArray = Encoding.convert(utf8arr, 'SJIS');
return Encoding.urlEncode(sjisArray);
}

数式を表示するJSライブラリ

MathJax
JavaScriptを読み込むとTeX形式で書いた数式を表示できるライブラリ。
若干のタイムラグが発生するけれども、きれいに数式が表示できるので便利。

実行ファイルのデジタル署名

ADOBE AIR
https://help.adobe.com/ja_JP/air/build/WS5b3ccc516d4fbf351e63e3d118666ade46-7ff0.html

この中の例にあるのは、これ。
https://www.thawte.com/code-signing/content-signing-certificates/adobe-air/
$299 / year


EXEPRESS（インストーラー作成ソフト）
http://www.webtech.co.jp/help/ja/exepress6/windows_exepress/config/startup/#check

MSのツールをつかった汎用的なデジタル署名方法
https://rms-digicert.ne.jp/codesigning/howto/signcode-signtool-command-line.html

ダウンロードするキット
https://developer.microsoft.com/ja-jp/windows/downloads/windows-10-sdk



その他：タイムスタンプサーバー
http://timestamp.comodoca.com/rfc3161

chart.jsでレーダーチャート

公式ドキュメントよりこの記事が参考になった
http://www.madeinclinic.jp/javascript/20160828/

公式
http://www.chartjs.org/docs/latest/charts/radar.html

SVGを手書き風のアニメーションにするライブラリ（vivus.js）

vivus.js
https://maxwellito.github.io/vivus/

SVGのストロークをなぞる感じのアニメーションができるライブラリ。
SVGを全部pathに変換して、stroke-dasharray と stroke-dashoffset をうまく適用させて手書きを再現しているみたいです。

下記サイトで、SVGファイルをアップロードするだけで試せます。
https://maxwellito.github.io/vivus-instant/

Chromeでローカルファイルにアクセスできるようにする

オプションをつけて起動する

Winキー → 「run」と入力（ファイル名を指定して実行） → 「chrome  --allow-file-access-from-files」と入力

※すべてのChromeウインドウを閉じてからでないと有効化されないので注意

確認

chrome://version/
にアクセスして、「コマンドライン」に「--allow-file-access-from-files」があればOK

参考
https://dev.classmethod.jp/etc/chrome-localfile-security/