テキストにかっこいいスタイルを与えたり、レスポンシブに対応した配置や複雑な形状の回り込み、タイプライターや案内板のようなアニメーションで一文字ずつ表示するなど、テキスト関連のjQueryのプラグインを紹介します。
テキストにかっこいいスタイルを与えたり、レスポンシブに対応した配置や複雑な形状の回り込み、タイプライターや案内板のようなアニメーションで一文字ずつ表示するなど、テキスト関連のjQueryのプラグインを紹介します。
6 Powerful jQuery Plugins to Create and Enhance Website Layout | Queness レイアウトに関する強力なjQueryプラグイン6つが紹介されていました。 一昔前では不可能では?と思われたような複雑なレイアウトもjQueryを使うことで簡単に実現できます。 ちょっと変わったレイアウトにしたいっていう時に参考にさせてもらいましょう UI.Layout リサイズ可能な複雑なレイアウト作成 Masonry ブロックを新聞みたいにしきつめて表示 jLayout divをならべてその親divのclassにルールにしたがって記述することで複雑なレイアウトが簡単に作れます jQuery pageSlide ページ全体をズラしてアニメーションしながらサイドバーを出すエフェクト jQSlickWrap 画像にあわせて文書をまわりこませられる C
jQuery Marquee Animation Plugin Preview - CodeCanyon 超かっこいいmarquee2.0を実現するjQueryプラグイン「fMarquee」。 ホームページをつくりはじめた時には誰もが使ったマーキー。覚えていくにつれ、ほとんど使われないかわいそうなマーキー。 そんなマーキーもjQueryで超かっこ良く、まるで映画のプロモーション動画に使われるようなエフェクトに生まれ変わったようです。 生まれ変わったマーキーを見てみよう 実装は超簡単! <script language="javascript"> $(document).ready(function() { $('.marquee').fMarquee({width: 960, height: 100}); // サイズをオプション指定 }); </script> <!-- 内容はdivに入
チェックボックスやラジオボタンなど、フォーム周り のデザインを美しくする事が出来るjQueryプラグ イン・Ideal Formsのご紹介。スタイルもいくつか 用意されており、フレームワークとして使えるよう です。デザインテーマもいくつか用意されている ので好みで選ぶことも出来ますね。 ボタン、セレクト、ラジオボタンやチェックボックス等のフォームデザインを変更できます。デザイの変更はcssのみで可能なフレームワークタイプなのでノンプログラマーな方でも気軽に使えそうですね。IE6以外は対応しているようです。 フォームのデザインをガラッと変えることが出来ます。よりデザインに統一感を出せそうですね。 テーマも用意されている Ideal Formsはフレームワークとしても利用出来るように、cssでデザインが変更できる作りになっています。現在は3つのcssファイルがテーマとして用意されていますのでそ
A 10 jQuery Accordian Plugins 20 jQuery AJAX Plugins 10 Ajax and jQuery Plugins 10 jQuery Ajax Widgets 10 jQuery Alert Windows Plugins 15 jQuery Animation and Effects Plugins 8 jQuery Animation Controls Plugins 10 jQuery ASP Plugins 10 jQuery Audio Plugins B 7 jQuery Browser Tweak Plugins 1 10 jQuery Browser Plugins 2 10 …
こんなサイトを作ってみました オッス、オラ日曜ネット大工。 1年に1回くらい趣味でwebサイトを作ったりする独学素人ノンプログラマーです。 仕事はIT系にかすりもしないけど、たまにサイトが作りたくなるんです。 htmlもCSSも知識不足ですが、作成ソフトに頼ればなんとかなります。 そんなレベルで無謀にも「JavaScriptも使いたいな」とか思ったりするわけですよ。 で、たまに「簡単にわかるJavaScript入門」なんてサイトや記事がありますよね。 ああいうのを書いてくださる人に、ちょっと言いたい。 あの、独学素人ノンプログラマーの俺をなめてませんか? あなた方の想像を絶するほどに、俺のIT系理解能力はゴミクズですよ! 「簡単に分かる入門」にさえ入門できません助けて先生! と、鼻水をたらしながら泣き出すような底辺レベルのスキルしかないザコであります自分は。 ですが、jQueryと出会い、
Slider Kit スライドショー、コンテンツスライダー、タブコンテンツ、カルーセルなどさまざまなスライドコンテンツに対応。
Today we want to share our first set of easy-to-implement buttons called ‘Mega Web Buttons Pack’. In this set you will find 42 buttons which you can use easily on […] Today we want to share our first set of easy-to-implement buttons called ‘Mega Web Buttons Pack’. In this set you will find 42 buttons which you can use easily on your website. We are using the WooFunction icon set released under the
Webデザイナーやフロントエンドデベロッパー 向けのフレームワークが登場したようですね。 HTML5/CSS3/jQuery/PHPを使って構成さ れており、シンプルで軽量。小規模レベルの プロジェクトのスターターキット等にも利用して 欲しい、とのことです。 話題を集めるHTML5やCSS3、jQueryで構成されているので勉強がてら触ってみるのもいいかもしれません。ライセンスはGPLとMITのデュアルライセンスです。 (X)HTML5, CSS3, PHP & jQuery Front-End Development Frameworkとのこと。PHPファイル1枚にHTML5/css3/jQueryを詰め込んだシンプルな構成です。 簡単に始められますよ。最初からそこそこ作られています。 マルチカラムのデモなんかも。 上記はIETesterを使用したIE7のキャプチャ。CSS-PIEなども
Apprise - The attractive alert alternative for jQuery 使い方簡単で見た目も綺麗なダイアログ実装jQueryプラグイン「Apprise」 次のようなダイアログを apprise('Hello?', options); だけで実現できるようになります。 optionsに色々渡すことで様々にカスタマイズが可能。 confirm っぽくしたり 入力ボックスにしたり。 アニメーションで表示させたりも出来ます。 ダイアログは色々ありますが1つの選択肢として覚えておいてもよさそうです。 関連エントリ 超カッコいい確認ダイアログをjQueryで実装するチュートリアル jQueryを使って作るシンプルなモーダルダイアログ その場でポップアップするクールな確認ダイアログ実装用jQueryプラグイン「jConfirmAction」 効果音付きでアニメーション
Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデート] よくアクセスいただくのでハブ的な役割くらいは果たそうと思います。 jquery / jQueryの本家です。 jQuer
jQuery とは、John Resig によって開発された JavaScript ライブラリです。 Ajax や DOMプログラミングを「簡潔に」「簡単に」書くことができる、軽量で強力なフレームワークです。 jQueryプロジェクトは、4つのプロジェクトで構成されています。 jQuery Core jQuery のコアライブラリを開発するプロジェクトです。Ajax や DOMプログラミングフレームワークを提供します。 jQuery UI jQuery Core上に構築された強力なユーザインターフェースライブラリです。 Sizzle 高速なセレクタエンジンです。jQueryでも使用されています。単独でも使用可能です。 QUnit 使いやすいJavaScriptのテスティングフレームワークです。 このサイトでは、jQuery Core、jQuery UI の日本語リファレンスを公開しています
Twitterの利用法の一つとしてユニーク なモノがあったので備忘録的にご紹介。 Twitterを簡易的なフィードバックツール にしてしまおう、という内容。今まで通り Twitterに投稿するボタンに、感想を加え るようにします。 普段、TwitterではURLとともに感想が書いてあることが多く、フィードバックのツールとしてTwitterを利用しているWebサイトも少なく有りません。このフィードバックをもっと簡易的にしてみよう、というのが今日の内容です。 サンプルは記事の下のほうにあります。 jQueryを使います。僕は基本的にWordPressを使う人なのでWPにあわせたコードです。便宜変更してください。 $(function(){ var url = "<?php the_permalink() ?>"; var post_title = "<?php the_title(); ?>"
ブロックサイズ内に画像を綺麗に収めるjQueryプラグイン「CJ Object Scaler... 次の記事 ≫:ストライプ等、Photoshop用の400個のパターンまとめ Fancy Countdown ファンシーなデザインのカウントダウンタイマー実装jQueryプラグイン「Fancy Countdown」 何らかのカウントダウンというと、待ち遠しかったりするもので、単純にテキストだけでカウントダウンしても面白みが少ないですね。 ということで、次のようなデザインのカウントダウンタイマーがjQueryで簡単に実現可能です。 あと何日でサイトオープン!みたいなティザーサイトを作る場合にも使えそう。 $(function() { $("#anyID").fancyCountdown({ 'year':2011, 'month':05, 'day':13, 'hour':13, 'minute
JK - jQuery SimpleFAQ 使いやすいFAQをサクッと作る際に便利なjQueryプラグイン「SimpleFAQ」。 FAQというと内容が多くなればページが長くなって見難くどんどん使いづらくなっていきますね。 そんな場合に、項目は並べつつも、クリックした際にアニメーションで質問のすぐ下に現れるようなFAQが簡単に作れます。 質問のリスト。 とりあえず質問が並んでいるので分からないことを探してもらいます。 そんなに大規模なFAQじゃなければ質問項目を羅列しておくだけでもそれなりに使いやすいです。 クリックすればページ移動とかもなく、その場にアニメーションしながら答えが表示されます。 別ページに移動したりといったことがなく、ストレスフリーで内容が見れます。仮に答えが的外れでも戻ったりせずにすぐに他の質問に行けます で、何がいいかという個人的におすすめする点は、作り方。 作り手は、
デモ:カルーセル機能付きのスライダー:垂直方向 jContentの実装 実装は簡単で、パネル内のコンテンツをdiv要素で配置し、数行のスクリプトを記述するだけです。 HTML <div id="demo"> <a title="" href="#" class="prev"></a> <div class="slides"> <div>...</div> <div>...</div> <div>...</div> <div>...</div> </div> <a title="" href="#" class="next"></a> </div> JavaScript <script type="text/javascript" language="javascript" src="js/jquery-1.5.2.min.js"></script> <script type="text/j
画像スライダーに関することならお任せ!なjQueryプラグイン「Slider Kit」 2011年04月12日- Slider Kit, sliding contents with jQuery 画像スライダーに関することならお任せ!なjQueryプラグイン「Slider Kit」 このプラグインを使うことで実に様々なスライダーが実現出来ます。以下にサンプルを。 一見普通の画像 カーソルを合わせるとページ送りが出るUI。これだけでもシンプルでかなり使えそう。無駄なUIは不要という方に。 ページインデックスを次のように○で表示したスライダーも作れます。 ページ番号がついたもの サムネイルがついた物 サムネイル+ラベル付き サムネイルを横に配置したもの シンプルにサムネイルを敷き詰めた例 何らかの製品等の特徴を表示するようなおなじみのタブUI型スライダーも。 画像だけでなくHTMLも使える タ
レイアウトの調整を簡略化したり、通常 は難しいレイアウトを可能にしたり、とい った補助的なjQueryプラグインのまとめ です。最近探す機会が増えたので今後 の為に備忘録的に記事にしておきます。 この手のプラグインは数多にあるので 好みで端折っています。 レイアウトの調整や補助などに使えるjQueryプラグインのまとめ。と、言っても大抵は既出だと思います。順不同。 Supersized 画面に合わせて自動的に背景画像を伸縮してくれるだけでなく、スライドショーにもなってくれます。いつか仕事で使いたい。最近FlickrのAPIにも対応しました。 Supersized jQuery UI.Layout Plug-in ブラウザごとの差異を考えずに自由にレイアウトを組めます。 jQuery UI.Layout Plug-in JQUERY CUSTOM CONTENT SCROLLER スクロール
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く