Rewish

ウェブデザイン、HTML、CSS、JavaScript、PHP、WordPress、Movable Typeなど、Web制作で役立つかも知れないBlog.

JavaScriptの記事一覧

記事数: 11

jQueryの開発コードをビルドして使う (Win & Mac)

カテゴリー
JavaScript
タグ
Git, jQuery

jQueryの開発リポジトリに入っているファイルは、開発用のためモジュール毎に分割されています。

コードを追う時は良いですが、開発中のjQueryが使いたい!と言う時に、これらを全て読み込むのはちょっと面倒なので、ビルドして一つのファイルにしてみたいと思います。

今回は、Windowsの場合Macの場合二つの方法を紹介します。

シンプルなイベントカレンダーを実装するjQueryプラグイン

カテゴリー
JavaScript
タグ
Download, jQuery

ある朝僕は、以下の用件を満たすカレンダープラグインを探していました。

  • シンプルなHTMLを吐いてデザインの変更が容易
  • コールバック関数である程度処理をイジれる
  • 月移動のアニメーションが素人ウケしそう

小一時間色々なプラグインを見ましたが、中々しっくり来るモノが無く、「これは探すより作った方が早そうかなぁ」と思ったので作ってみました。

JavaScriptのDateオブジェクトを拡張してPHPのdate関数を実装

カテゴリー
JavaScript
タグ
Download

某勉強会のグループチャットにて、『JavaScriptでXMLを取得、パースして適当に表示しなさい』と言う宿題が出た時、ちょっと欲しいなぁと思ったので勉強がてら作ってみました。

一応date関数に対応する全てのフォーマット文字列が使えますが、タイムゾーン周りを正確に実装するのは実質不可能なので、eは「Asia/Tokyo」、Tは「JST」固定になっています。

その他、副産物で日付周りのメソッドも色々生えてるので、良かったら使ってみて下さい。

アメーバの『ペタ』を手軽に付けられるGreasemonkey

カテゴリー
JavaScript
タグ
Download, Greasemonkey

もの凄く需要が無さそうですが書いたので公開。

アメーバにはペタと言うよく分からない機能が付いていて、ペタが付けられたらペタ返しをするのが慣わしのようですが、通常のプロセスでペタ返しを行うと3クリックもしなければなりません。

そんな特殊な文化に慣れていない身としては、この3クリックは非常に煩わしいかったので、ペタ帳(ペタの履歴)画面から直接ペタを付けられるGreasemonkeyスクリプトを書いてみました。

指定した背景画像をx秒毎に切り替えるjQueryプラグイン

カテゴリー
JavaScript
タグ
Download, jQuery, Plugin

某日Twitterにて、"img要素じゃなくて背景を入れ替えるプラグインを探している"と言う旨のタイムラインが流れていたので、実験的に書いてみたスクリプトのプラグイン版。

その時書いたスクリプトはプラグインですら無くて、凄く使いにくいモノだったので、より簡単に使えるようにプラグイン化してみました。習作。習作。

input要素にも使えるjQueryのロールオーバープラグイン

カテゴリー
JavaScript
タグ
jQuery, Plugin, Rollover

以前 jQueryだけで画像のロールオーバーを実装する方法 で紹介したロールオーバーを、より簡単に使えるようにプラグイン化しました。

jQueryプラグインの習作をするために作成したモノではありますが、プラグイン化したことでかなり楽に使えるようになったので、気が向いたら使ってみてください。

SyntaxHighlighterのバージョン2系がいい感じ

カテゴリー
JavaScript
タグ
Coding, Syntax

ここ最近、密かにブログを Movable Type から WordPress への移行作業を進めていて、使用しているライブラリの見直しやバージョンアップ確認などを行っていたりします。

コードをハイライトするJSライブラリ SyntaxHighlighter も例外なく確認しに行くと、ややハイテンション気味にバージョン2系リリースの報告がされていました。

このSyntaxHighlighter 2.x、前バージョンと比べて色々いい感じになっているのでご紹介。

PHPとjQueryでCometっぽいモノを実装する

カテゴリー
JavaScript, PHP/MySQL
タグ
Ajax, Comet, jQuery

クライアントからのリクエストに対してすぐに応答せず溜めておき、何らかのタイミングを見計らって応答(レスポンス)を返す技術、Comet

例えばチャットなんかで使うと、相手が発言したタイミングでレスポンスが返ってくるので、リアルタイムに会話が出来たりする訳です。

ただ、"本物のComet"は実装にはやや知識的なコストが掛かるので、今回はPHPとjQueryを使ってもう少し簡単に実装してみたいと思います。

※あくまでも実装の一例なので、このままでは利用シーンがかなり限定される事をご留意下さい。

jQueryだけで画像のロールオーバーを実装する方法

カテゴリー
JavaScript
タグ
jQuery, Rollover

ロールオーバーの為にわざわざプラグインを使うのは、あんまりシンプルじゃないかなと思い、色々探していた頃 テレパス・ラボ : 画像のロールオーバー に出会いました。

この記事を発見したのは1年以上も前ですが、この方法を紹介している記事をあまり見かけないので、改めてコチラでご紹介したいと思います。