タグ

JavaScriptに関するsmilewebのブックマーク (5)

  • [JS]Google Mapsと連動してパネル表示も切り替えるスクリプト

    ナビゲーションのホバーに合わせて、Google Mapsとパネルの表示を切り替えるスクリプトを紹介します。 <textarea name="code" class="html" cols="60" rows="5"> <li data-geo-lat="41.9786" data-geo-long="-87.9047"> <h3>O'Hare Airport</h3> <p>Flights n' stuff</p> <p class="longdesc"><strong>About:</strong> O'Hare International Airport has been voted the "Best Airport in North America" for 10 years by two separate sources: Readers of the U.S. Edition

  • 竹取 JS

    画面をダブルクリックで縦書きと横書きを切り替えることができます。要素を指定して縦書きにしている場合は、次回アクセス時に同じ表示が引き継がれます。 どんなサイトでも縦書きにするブックマークレット。 ↓右クリックで「お気に入り」に保存するか、リンクをドラッグしてブックマークバーにドロップします。 「縦書きにする・iPhone 用リンク」 「縦書き可能にする・iPhone 用リンク」 「段組み縦書き可能にする・iPhone 用リンク」 iPhone に登録するには? とりあえずこのページを共有ボタンからブックマーク。 iPhone 用リンク を長押ししてコピー。 ブックマークを開いて、追加したブックマークを「編集」。 名前を「縦書き可能にする」などに変更し、URL 欄に上記コードをペースト。 最初の「http://」を削除。 注意! やや動作が重いです! うまく変換できなかったときは、画面をダブ

  • テキストをフェードインしながらマウスオーバーで色を変える「jQuery Glow」

    様々なシーンで利用されている軽量かつ高機能なjavascriptライブラリjQuery。当に色々な事が工夫次第で可能ですが、今回紹介するのはテキストをフェードインしながらマウスオーバーで色を変える「jQuery Glow」です。言葉で説明するとわかりづらいので、まずは下記からデモをご覧下さい jQuery Glow Demo 通常のテキストにマウスオーバーするとゆっくりとフェードしながら色が変わっていきます。 詳しくは以下 色の変化はscript部分で制御されており、テキストの元のカラーを定義して指定したクラス名を表示させたい箇所に割り当てるだけです。 非常に細かい部分で、使いどころは限られるかもしれませんが、HTMLで少し動きを付けたい時やテキストを主体とした大きなメニューを設置していたりする場合には良いかもしれません。シンプルな作りになっていますので、既存のサイトなどでも簡単に実装で

    テキストをフェードインしながらマウスオーバーで色を変える「jQuery Glow」
  • jQuery:画像一つでもロールオーバー効果 | in hiding.

    メニューの数が多いサイトで、そのメニューすべてにロールオーバー効果を仕込もうとするとメニューの数だけロールオーバー用の画像を作成しプリロードしなければならないですよね。先日手がけたサイトではトップページだけでもメニュー含めロールオーバー部分がが30個以上あって大変でした。 マウスオーバー時に画像が変わる場合はやっぱりそれだけ用意しなければなりませんが、例えばマウスオーバー時に濃くなるという仕様であればこの方法がなかなか使えたのでメモ。 用意するものはjQuery体と画像一つ。スクリプトは下記のようになります。 <script type="text/javascript"> function FlashBlock() { /*ページ読み込み時に画像の透明度を50%にする*/ $(".FlashBlock").fadeTo(100, 0.5); /*マウスオーバー・アウト時の処理*/

  • jQueryプラグイン用途別「いつもの」ベスト1

    2010年2月17日 サイト制作時に実装することの多い必要最小限の機能について、僕の「いつもの」jQueryプラグインを紹介します。 毎回プラグインを探すのが面倒だから jQueryは、プラグインの数が豊富なため、自分に合ったものを探すのが非常に大変です。毎回、もっといいものがあるのでは・・・、と、プラグインを探す作業で1日が終わってしまう悲しみの果てに、何が待ち受けているかは分かりませんが、できることなら汎用性の高い「いつもの」を決めておきたいところです。今回は、サイト制作時に実装することの多い必要最小限の機能について、僕の「いつもの」jQueryプラグインを紹介したいと思います。 画像のロールオーバー input要素にも使えるjQueryのロールオーバープラグイン | Rewish ウェブサイトにナビゲーションがある限り、ロールオーバーは必須の機能です。cssでやってる頃は、「Java

    jQueryプラグイン用途別「いつもの」ベスト1
  • 1