カルーセルプラグインで迷ったらこれ！レスポンシブにも対応「slick」jQueryプラグイン

お仕事でも結構な頻度で必要になるカルーセル。
自由にプラグインが使用できるとき、
最近お気に入りなのがこの「slick」です。

もう、こちらのプラグインに出会ってからは少し立っているので、
使い方は他のサイトでも詳しく載っていますが、
今回は、実際に「このプラグインを私が使おうと思った理由」をご紹介したいと思います。
なので、複数のカルーセル系プラグインでどれを使おうか迷っている方の参考になれば、と思います。

(more…)

Feedlyのリストに色を付けるChromeの拡張機能をつくってみた

title

Google リーダーのサービスが終了ということで、とりあえず乗り換え先にFeedlyを選んでみました。
フィードの移行も簡単にできますし、使い勝手もGoogle リーダーとそれ程変わらず、なかなかいい感じです。

ただ、Chromeの拡張機能のReader Plusを使っていたのでやはり記事リストは色分けしたくなり、
Chromeの拡張機能作成の勉強がてら、リストを色分けする拡張機能「FeedlyColorfulListView」を作ってみました。
ついでにfavicon表示も追加。

拡張機能の作り方はドットインストールをみて勉強しました。

Chrome Web Storeに登録するのに手間がかかりそうなうえ、
ざっくり作ったいろいろアレなものなのでとりあえずここで公開。

FeelyColorfulListView 0.0.11(2013.10.30)
manifestを修正。
ダウンロード

ファイルをダウンロードして、Chromeの拡張機能にドラッグするとインストールできます。
バージョンアップする場合は一旦拡張機能からアンインストールしてからインストールしてください。

PhoneGapで長押しした場合のテキスト選択を無効にする

PhoneGapで作成したiPhoneアプリのプロジェクトで、長押しした場合のテキスト選択はCSSに下記を記述することで無効にできます。


* {
-webkit-touch-callout: none;
-webkit-user-select: none;
}

PhoneGapでプロジェクトを作成した場合にできるwww/css/index.cssでは下記のようにbodyに対して記述されてるのですが、これだとうまくいかないことがある為、*に対して記述します。


* {
-webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
}

body {
-webkit-touch-callout: none; /* prevent callout to copy image, etc when tap to hold */
-webkit-text-size-adjust: none; /* prevent webkit from resizing text to fit */
-webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */
background-color:#E4E4E4;

Twitter Bootstrap　
メモ（１）
「グリッドシステム？」「レスポンシブデザイン？」

Twitter Bootstrap。
今になって使ってみようと思ったら
「え？ここってどうするの？」と・・。

使い方については英語のサイトばかり・・
日本語の親切なサイトもあるのですが
それでもわからないことがあったので、調べて、
「そうだったのか・・・」と思ったものをメモとして記事にしました。

基本的な使い方については下記のサイトをどうぞ！
Bootstrap from Twitter←本家（ここから持ってくる）
日本語の基本的な使い方・説明をしてくれているサイト。
ブートストラップスターターテンプレート
GreenApple-Room　「Twitter Bootstrapの使い方」

そして、ここからは「そうだったんだ・・」メモ。

(more…)

iOS・Androidのハイライト表示の指定について。その２

iOS・Androidのハイライト表示の設定について　（その２）

以前、スマートフォンのハイライト表示について記事を書きましたが、
→”iOS・Androidのハイライト表示の指定について。”
その中の「ｊｓを使ったハイライト表示の指定」について質門を頂いたので追記させて頂きます。

頂いた質門は
”idではなく、ｃlassのように複数のリンクでもハイライト表示させる方法はあるか”
といった内容でした。

今回その質門を受け、改良しようとした所、
javascriptだけではclassの指定などが面倒でしたので
jQueryを使って改良致しました。
(more…)

HTML5・CSS3でWebサイトを作成する際、IE用に必要になりそうなjavascriptライブラリまとめ

HTML5やCSS3を使用したwebサイトがたくさん増えています。
ですが、IE8以下のようなHTML5やCSS3に対応していないブラウザを使っている人もまだまだたくさんいます。

それでもHTML5やCSS3を使ってIE8以下にも対応したwebサイトを作りたい！作らなければ！という方は
これから紹介するライブラリが必要になるのではないでしょうか。

それぞれを詳しく紹介してくださっているところはいろいろありますが、
自分のメモとしてパッと見て大体の内容がわかるまとめを作ってみました。
需要があれば見ていってください。

(more…)