読者です 読者をやめる 読者になる 読者になる

MATz Tech

webの技術的なことを中心にいろいろと

javascript

jsとcanvasで画像の容量を落とす〜その2〜

前回のだと上手くcanvasに描画されない場合が多かったので、やり直してみました。 htmlはこちら。 <form action="" method="post" id="imageForm"> <img src="" id="preview" /> <canvas id="canvas"></canvas> <input type="file" id="imageSelect" onChange="imgDisp();" /> <input type="button" onClick="imgUpload();" value="アップロード" /> </form> まず、ファイル選択時の処理…

MEANスタックとMERNスタック

先日、Node.jsの勉強会に行ってきたので覚え書き。今までJavaScriptはクライアントサイドのjQueryくらいしか経験がなく、サーバ側は触ったことなかったんですが、たまたま近所で勉強会やってたんで行ってきました。いろんな話聞けたのですが、その中で印象深…

ファイル選択した画像をモーダル表示

前回に引き続き、画像のファイル選択ネタです。今回は、ファイル選択した画像をモーダルウインドウで表示します。 jQueryのプラグインでこれ系のはけっこうあるんですけど、敢えてプラグインに頼らずやってみました! htmlとcssはこんな感じです。 <div id="modal-content"> <img src="" id="preview" width="500px" /> <a id="modal-cancel" class="button-link">cancel</a> <a id="modal-ok" class="button-link"></a></div>…

【修正あり】jsとcanvasで画像の容量を落とす

【2017/4/2修正】 phpのソース載せてなかったので、追記しました。 phpで画像アップロードしたいけど、最近のiPhoneのカメラとか画質良いので容量オーバーしちゃいますよね。まあphp.iniで「post_max_size」とか触ればいいんですけど、なんせ重いです。それ…