2015.10.04 OpenCVで画像サイズを変更する方法2つ 直接比率を指定する方法 #include <iostream> #include <opencv2/highgui.hpp> #include <opencv2/imgproc/imgproc.hpp> int main(int argc, const char* argv[])
2015.10.02 C言語でテキストファイルを読み込み特定の1行を削除する ネットで調べましたが、何やら難しいことが書かれていたので今回は非常に単純愚直な方法で実装しました。テキストファイルから1行ずつ読み込み、配列に格納。その後消したい行が格納されているchar配列の先頭文字を \0 にして、これ以外をテキストファイルに上書きするという方法です。 ソースコード #include <stdi
2015.09.27 MacのXCode7.0~にHomebrewを使ってOpenCV3.0.0を導入する Homebrewのダウンロード ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" まず、このコードをターミナルにコピペしてエンターを押せばダウンロードが始まります。 OpenCVのダウ
2015.09.26 CSSでホバーすると下からさっと別の背景が広がるエフェクト CSS3になってからアニメーションの幅が広がりましたよね。今回はちょっと変わったホバーエフェクトです。すごく簡単な仕組みで実装できるので良かったら試してみてください。 デモ Hover! マウスホバーすると下からカーテンのようにアニメーションします! ボタン下層部を作る Hover!
2015.09.21 CSSだけでマウスのカーソルを消す ポインターを消すという操作は普通は必要ないのですが、Canvasをやっていてカーソルが邪魔になったので消す必要がありました。JavaScriptでカーソルを消さなくても、CSSだけでできてしまったので紹介します。 デモ このエリアではカーソルが消えます。 カーソルを消す このエリアではカーソルが
2015.09.20 CSS3で作るメニューに使えるスタイリッシュなホバーエフェクト デモ Menu Menuにマウスをもっていくとエフェクトがでます。以下では、作り方を説明していきます。 基本部分をつくる Menu Menu a { display: block; position: relative; padding: 12px 14px; }
2015.09.15 CSSの擬似要素:beforeや:afterのcontent内の任意の位置で改行する CSSの擬似要素はとても便利ですよね。タグの数をかなり減らせることができてソースコードが見やすくなります。擬似要素を使う際、content 内で改行できたらなと思ったことはないでしょうか。実は改行することはできるのです。その方法を紹介したいと思います。 擬似要素内で改行する 擬似要素のcontent内で改行できる
2015.09.13 JSでFisher-Yatesアルゴリズムを使って配列をシャッフルする 今回はJavaScriptを使って説明しますが、どの言語でも変わりません。短いコードで効率のよいプログラムです。ほかのシャッフルアルゴリズムと比べて計算量がO(n)であり、偏りがないことがこのアルゴリズムの特徴です。 Fisher-Yates AFTER: シャッフルする デモを用意しました。
2015.09.12 ダウンロード不要で簡単に高品質な画像を使えるWebサービス Webサイト制作時、一時的に画像を配置したいときってありますよね。いちいちフリー素材サイトからダウンロードして持ってくるのは非常に面倒です。しかし、今回のWebサービスを使えば簡単にハイクオリティな画像を配置することができます! 基本的な使い方 https://unsplash.it/ のあとに
2015.09.10 今更だけどWebアイコンフォントFontAwesomeの使い方まとめ 今や多くのブログやWebサイトで使われているWebフォント。その中でも、気軽に利用することができるFontAwesomeの使い方を紹介します。 導入 CSSファイルをダウンロードして読み込んでもよいのですが、もっと手軽にCDNを利用する方法があります。今回はこちらの方法で説明していきます。 公式サイトへアクセス
2015.09.08 jQueryでテキストファイルを読み込み改行で分けて配列に格納する 普通はJSONを使った方が便利は便利なのですが、改行で区切っていくだけの場合はテキストファイルの方が効率よく編集できますよね。今回は、改行コードによって、文字列を配列に格納する方法を紹介します。 サンプルのテキストファイル これは僕の好きな食べ物(どうでもいい)です。今回はサンプルとしてこの4行のテキストファイルを配列
2015.09.06 CSSでplaceholderの文字色などのスタイルをカスタマイズする placeholderとは よく検索ボックスでキーワードを入力という文言を目にしたことがあると思います。これがplaceholderです。デフォルトでは、灰色をしていますが、このように紫色に変えたりすることができます。 placeholderのスタイル /* Chrome, Safari
2015.09.04 リサイズ完了後に実行できるjQueryプラグイン | jquery.resizeend.js これまた便利なjQueryプラグインを見つけました。$(window).on('resize') はブラウザ幅を変えている間中実行されてしまいますよね。このプラグインは、ブラウザ幅を変え終わったときに実行させることができます。 ダウンロード https://github.com/nielse63/jquery.resi
2015.09.03 現場のプロでも意外と知らないHTML/CSSのクラスについてのテクニック クラスには日本語も使える .日本語 { color: #fff; } これ意外と知らない人多いんですよね。 先頭が数字のクラス名 普通に指定するとCSSが効かない .1-num { color: #fff; } これだと、文字色は白になりません。 で
2015.09.02 CSSでリストの最初だけborderなどのスタイルを打ち消すベストな方法 Webデザインがよくできるという人でも意外と使ってしまっているのがCSSの打ち消しです。CSSの設計上、打ち消しというのはあまりよくありません。none とか 0 とか初期のスタイルをわざわざ書いているからです。そこで、できるだけ打ち消しをしないコーディングの一例として今回の方法を紹介します。 多くの人がやっている打ち消し
2015.08.30 CSS3で作るマウスホバーするとぼよーんとアニメーションするエフェクト CSS3を使って滑らかにアニメーションするエフェクトです。以下のデモでは、ボタンを例にしていますが、画像などにも使えるエフェクトとなっています。サイトのワンポイントとして導入してみるといいかもしれません。 デモ Button ボタンにマウスをもっていくとぼよーんとアニメーションします。 HTML
2015.08.26 CSSで文字列をドラッグして選択したときの色や背景色を変更する 意外と多くのブラウザに対応しているテクニックです。IE9+とモダンブラウザで使用可能です。こういった細かいところもしっかりとカスタマイズしてあるサイトを見るとほっこりします。 テキスト選択時の色を指定できる 通常は、文字を選択するとこんな感じの色ですよね。 テキスト選択時の色を指定できる .
2015.08.20 c++で処理時間の計測をする 基礎の基礎ですが、ある関数の処理時間を計測したかったので <ctime> ライブラリの clock() を使って実装しました。 処理時間の計測 #include <iostream> #include <ctime> using namespace std; class Tim
2015.08.19 jQueryで複数のjsファイルをまとめて動的に読み込む 大規模なサイトを作る際は目的別にjsファイルを分けて作業します。ツールを使ってそのファイルを統合してもよいのですが、分けてあった方がわかりやすいですよね。そこで、jQueryでまとめて読み込む部分を実装すれば楽になれると思ったので紹介します。 htmlファイル <!DOCTYPE html> <html
2015.08.17 jQueryで文字や記号で囲まれた文字列を正規表現を使って置換する 最近、正規表現の勉強を始めて、まずよく使いそうな文字や記号で囲まれた部分を置換するというプログラムを書いてみました。 【 】で囲まれた文字列を消す 【1】サンプル 2.テキ【スト】 【3.テス】ト こんな感じのマークアップだったとします。 jQueryで一括置換 $('.text').each(