脱jQueryのためにしたこと - Qiitaこの記事は加筆して「脱jQueryのためにしたこと - ICS MEDIA」に引っ越しました。 64000PV、480いいねとフロントエンド界隈でご好評いただいた内容です。ぜひご覧ください。 ※Google検索で辿り着いた方にリンク切れとなっては申し訳ないので、元の記事を残しています。ご了承ください。
フェード表示やタイピング風など、テキスト表示に動きをつけられるjQueryプラグイン 8 - NxWorld
いずれもテキストがフェードや回転といったアニメーション付きで表示されたり、一文字ずつタイピングされているような見せ方を実装することができるjQueryプラグインです。 同じようなプラグインが並んでいる感じですが、軽量なものやオプションが豊富に揃っているもの、日本語にもしっかり対応しているかなどそれぞれ特徴もあるので、こういったものを使いたい時に少しでも選択肢が広がるよう良さそうなものを備忘録兼ねてまとめました。 Letter by Letter JS Letter by Letter JS はテキストを徐々に表示させる効果を簡単に実装でき、1KBという軽さも特徴のjQueryプラグインです。 デモ画面などでは全て英語が使われていますが、日本語でも動くのは確認できました。 オプションとして表示スピードと表示タイプを指定することができ、表示タイプでは単純に表示させる'show'とフェード表示さ
今っぽくなった！トレンドをおさえたjQuery プラグインまとめ
作成：2015/04/6 更新：2016/06/29 Web制作 > トレンドとなりつつある視覚効果や、細部にちょっとした動きを取り入れたいときに使えるjQuery プラグインをまとめました。ユーザーが使いやすくなるよう、ページにひと工夫したいときに。少し前のプラグインもありますが、今から使えそうなものもピックアップ。 エンジニア速報は Twitter の@commteで配信しています。 もくじ マイクロインタラクション １．粘性 ２．移動するプレースホルダー ３．滑らかにページ移動させる ４．パスワード強度を可視化 ５．オートコンプリート ６．テキスト入力 ７．Google Map（吹き出し・マーカー） ８．オートページャー ９．プログレス12パターン １０．ノーティフィケーション レタリング １１．１文字ごとに指定 フルスクリーン １２．モーダルウィンドウ（全画面） １３．フォーム（全
[JS]レスポンシブにしっかり対応！高さの異なるパネルを揃えたり、成り行きにするスクリプト -EqualHeight.js
divなどで配置したパネル内の要素の量が異なっていても、全てのパネルの高さを揃えるjQueryのプラグインを紹介します。 高さを揃える系としては後発のスクリプトですが、レスポンシブにしっかり対応しているのがポイントです。 一列のパネルはもちろん、段組でもOK、省スペースのスマフォ用に成り行きもコントロールできます。
[JS]jQueryのプラグイン100選 -2013年総集編
今年も数多くの素晴らしいjQueryのプラグインがリリースされました。当ブログで紹介したものをはじめ、未紹介のものまで、jQueryのプラグイン100+α選です。 今年目立ったのは、アニメーションを使ったスクロール関連のスクリプト。 スクロール前提の1ページサイト、パララックスなど、コンテンツをより大きなサイズで楽しむものが増えました。また、スマフォ・タブレットに大きく影響を受けたインタラクションも目立ちましたね。 1ページコンテンツ用のスクロール関連 パララックス スクロール関連 スクロールで定位置関連 その他スクロール操作・補助関連 スクロールバー関連 レスポンシブ関連 エフェクト関連 ナビゲーション関連 レイアウト関連 画像ギャラリー関連 画像拡大・配置・キャプション関連 コンテンツスライダー関連 カルーセル関連 アニメーション関連 フォーム関連 コンテンツのツアー関連 テキスト関連
サイトの使い方をその場でステップに分けてオーバーレイできるJSライブラリ「Intro.js」:phpspot開発日誌
Intro.js | Better introductions for websites and features with a step-by-step guide for your projects. サイトの使い方をその場でステップに分けてオーバーレイできるJSライブラリ「Intro.js」 はじめてのサイトの場合、何をやっていいか、使い方もよくわからない場合も少なくなさそうですが、このライブラリを使えば、サイトの一部をハイライトさせて説明のチュートリアルをサイト上で作ることが出来ます。 data-step, data-introという属性を付与していくだけで、簡単に使い方のチュートリアルが作れてしまうところがよさそうです。 キーボードの左右のキーで次に送ることもできます。プレゼンのデモとして使うのもアリかもしれません。 関連エントリ サイトの使い方をその場でアニメーションしてチョー
arbor.js
about arbor Arbor is a graph visualization library built with web workers and jQuery. Rather than trying to be an all-encompassing framework, arbor provides an efficient, force-directed layout algorithm plus abstractions for graph organization and screen refresh handling. It leaves the actual screen-drawing to you. This means you can use it with canvas, SVG, or even positioned HTML elements; whate
[JS]jQueryのプラグイン33+1選 -2012年10・11月
equalize.js 高さや幅が不揃いのDOM要素を同じ高さ・幅にします。 height, width, outer-, inner- に対応
JavaScriptのライブラリを沢山集めてカタログ化しているWebサイト・Jster - かちびと.net
JSライブラリのまとめサイトの ご紹介。既知の方も多いかもし れませんが、探すのに便利なの で改めてご紹介します。カテゴ リ分けもしてくれているので探 しやすいです。 様々なJSライブラリがまとめられています。探し物がある際は覗いてみるといいかも。 UIやメディア、グラフィック、ユーティリティなどのカテゴリに分けられています。現在は900ほどのライブラリがまとめられています。 シンプルで探しやすいのではないかと思います。ライブラリはそれぞれ簡単な説明もしてくれています。 パッと見たところ、評価の高い印象のライブラリに絞ってくれている・・・気がしました。（気がするだけかも 困ったら覗いてみようと思います。 Jster
【提案】onkeypressの正しい併用の仕方！ - 研究室
JavaScript、Ajax、HTML5(API)、Ruby…Web及び関連技術の実験&情報公開&制作物紹介。 前エントリー（onkeypress、乱用禁止！）からの続きです。 お暇なら、前エントリーからお読みください。 onkeypress イベント属性の正しい指定の仕方を提案します。 主に『onclickと同時にonkeypressイベント属性を指定する場合の正しい指定の仕方』という視点での提案です。 ざっくりとまとめると、対処法としては以下の3パターンがあります。 onkeypressは使わない！（onkeypressの指定を削除する） onkeypressイベントハンドラにフィルターをかける その他（個別の対応が必要） 【2007/05/02】追記。
[JS]高性能で設置も簡単、ブラウザ枠いっぱいに背景画像を配置するスクリプト -bgStretcher
デモページ：Super Slider スライドのスーパー版で、斜め方向のスライドで画像を切り替えます。 bgStretcherの主な特徴 セットアップはシンプル 全てのモダンブラウザをサポート 画像は一枚だけでなく、複数枚にも対応 対応ブラウザ Internet Explorer 6, 7, 8, 9 Firefox 2, 3, 4 Opera 9+ Safari Chrome bgStretcherの使い方 Step 1: ファイルのダウンロード サイトの「Download」よりファイル一式をダウンロードします。 一式には必要なファイル全て（jqeury.jsも）が含まれています。 Step 2: 外部ファイル 外部ファイルを下記のように<head>～</head>に記述します。 <script type="text/javascript" src="../jquery-1.5.2.mi
jQueryのそれJavaScriptでどうやるんだっけ？の際に使えるリファレンス:phpspot開発日誌
jQueryのそれJavaScriptでどうやるんだっけ？の際に使えるリファレンス 2012年01月24日- From jQuery to JavaScipt: A Reference | Nettuts jQueryのそれJavaScriptでどうやるんだっけ？の際に使えるリファレンス。 jQueryをインクルードすれば、$(element) とか使えて便利ですが、あくまでjQueryの機能であって素のJSでやる場合は全く違いますね。 jQueryなら簡単だとjQueryから入った人もいるかもしれませんが、このリファレンスで基本も知っておくと、ちょっとした処理にいちいちjQueryを使わなくてよい場面ができそうです まあクロスブラウザの差異吸収してくれて面倒じゃないので、基本はjQueryを使うのが無難ではありますね。 関連エントリ レスポンシブなjQueryスライダー実装プラグイン８個
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
リニューアルに使いたいオシャレな動きCSS＆JSパーツまとめ20選 | 楽天ティップスRakutenTips