テキストエリアにTwitterみたく残り文字数を超簡単に表示できるjQueryプラグイン「NobleCount」:phpspot開発日誌
テキストエリアにTwitterみたく残り文字数を超簡単に表示できるjQueryプラグイン「NobleCount」 2010年03月25日- jQuery Plugin: Give Your Characters a NobleCount The Product Guy テキストエリアにTwitterみたく残り文字数を超簡単に表示できるjQueryプラグイン「NobleCount」。 今、テキストエリア内に何文字はいっているのか？というのは、文字数制限をしているフォームにとっては重要なユーザビリティになりますね。 送信ボタンを押した後に、文字数オーバーです、というのは不親切ですしサーバに無駄なリクエストが増えることになります。 Twitter では残り文字数を表示していますが、これをjQueryで１行で実装してしまえるのがこのプラグイン。 $(element).NobleCount('#ta
jQuery でページスクロール - daily dayflower
jQuery 1.2 以降だと scrollTop（と scrollLeft）という疑似スタイルが利用できるようになったので，jQuery UI を使わずとも，jQuery Core 本体だけでページ内スクロールができるようになりました。 たとえば， <html> <body> <p> blah, blah, blah, ... blah, blah, blah, ... </p> <p> <a href="#" id="link_to_top">ページの先頭へ</a> </p> </body> </html> このような HTML で「ページの先頭へ」というリンクをクリックしたときに，スムーズにスクロールしたいのなら， $(function () { if (! $.browser.safari) { $('#link_to_top').click(function () { $(thi
[JS]簡単に設置できるページ内をスムーズにスクロールできるスクリプト -Page Scroller ver.3 | コリス
以前、紹介した「Page Scroller」のバージョンアップ版「Page Scroller ver.3」の紹介です。 追記： 2013年10月26日 ver.3.0.9をリリース jQueryの旧版によるXSSに対応しました。 2011年5月4日 デモおよびダウンロードファイルをjQuery1.6に変更しました。 2011年1月31日 ver.3.0.8をリリース 機能を追加しました。 2010年11月19日 ver.3.0.7をリリース ライセンスを変更しました。 2010年11月17日 デモおよびダウンロードファイルをjQuery1.4.4に変更しました。 2010年9月19日 デモおよびダウンロードファイルをjQuery1.4.2に変更しました。 2009年7月6日 対応ブラウザ（IE8, Fx2.5, Chrome2）を更新しました。 2009年2月23日 ver.3.0.6をリ
![[JS]簡単に設置できるページ内をスムーズにスクロールできるスクリプト -Page Scroller ver.3 | コリス](https://cdn-ak-scissors.b.st-hatena.com/image/square/bc54860ba06deaa45382cf2bddc929515def0354/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fshared%2Flogo-2014050501-en.png)
jQueryによるアニメーションエフェクトの基本 (3/5)
スライドアニメーションで表示／非表示を切り換えるslideDown()／slideUp() slideDown()／slideUp()は、セレクターで指定した要素の表示／非表示をスライドアニメーション付きで切り換える命令です。slideDown()は非表示の要素の高さを0から本来の高さに近づけながら表示し、slideUp()は表示状態の要素の高さを少しずつ0に近づけながら非表示にします。 $(セレクター).slideDown(スピード,コールバック関数); $(セレクター).slideUp(スピード,コールバック関数); サンプル06は、slideDown()／slidUp()を使って、「開閉パネル」(Collapsible-Panel)と呼ばれるUI部品を作成したものです。dt要素がクリックされると、css()を使ってdd要素のdisplayプロパティを調べ、displayプロパティの値
Ajaxによるタブメニュー : jQuery idTabs
[PROCESS3][LEVEL3]このサイトの上部の黒板風ボードのタブの切り替えにArchivaさんのJavaScriptをずっと使わせていただいていたのですが、このところIEにおいて挙動不審が見うけられた（タブを切り替えるたびにページ内リンク位置に自動スクロールしてしまう）のでjQuery idTabsに変更しました。 悩ましきIE jQuery系のJavaScriptを選んだのは、 jQuery系のJavaScriptを設置してからおかしくなった。 以前もjQuery系とPrototype系とでかみ合わなかった。 などから、どうもIEではjQuery系のJavaScriptを使う場合はjQuery系一本でいかないと具合が悪いのではないかと思われたからです。実際、jQuery系一本にしてみたところ挙動不審が収まったので全くの的外れではないように思われます。 jQueryが悪いのか、それ
Coda-Slider 1.1#5
3 Considerations For Your Website Slider + where to find the original Coda-Slider plugin Niall DohertyFounder and lead editor at eBiz Facts Welcome to my concise website slider guide. If you want to know: The pros and cons of using a slider on your website If your website already has built-in slider capability How to “roll your own” slider What happened to the original jQuery Coda Slider plugin Th
ページ移動の必要が無くなるページング系jQueryプラグイン・Pagination Plugin
ページングのユーザビリティを あげたいけど、オートタイプは 嫌だ、と言う方にオススメの jQueryプラグインがありました。 選択肢の一つに如何でしょう。
jQueryとCSSで作るiPhone風ラジオボタン・チェックボックス
2014年8月20日 jQuery いつも使っているラジオボタンやチェックボックスにもっと彩りを！ここではCSSとjQueryを使ってiPhone風のデザインに変える方法を紹介します。使用する画像は一枚のみ。CSSスプライトで表示位置を変えます。サンプルも用意してみたので覗いてみてくださいね！ ↑私が10年以上利用している会計ソフト！ サンプルはこちら。IE7, IE8, FF, Chromeで正常動作 See the Pen Mobile like radio/check buttons by Mana (@manabox) on CodePen. ファイルを準備 必要なファイルを準備します jQuery こんな感じの画像を作る コーディング ファイルを読み込む ヘッダー内にjQueryを読み込ませます。 <script type='text/javascript' src='/samp
コンテンツにエフェクトを掛けるjQueryプラグイン10個
個人的に必要になるかもと思ってメモ。 テキストや画像にエフェクトを与えて Webサイトを動きのあるサイトにする 手助けをしてくれるjQueryのプラグイン をいくつかご紹介します。 コンテンツに対するユーザーの興味を高めたり、画像を使用せずテキストを装飾したりと、使い方次第でいろいろ用途がありそうです。 Sliding Door Effect マウスオーバーで画像が4隅に開きます。動きも素敵。 Sliding Door Effect / デモ Rainbows テキストにグラデーションや影をつけます。これは凄いですね。 Rainbows / デモ Opacity to Show Focus マウスオーバーしたコンテンツ以外に半透明のエフェクトを掛けるjQueryプラグイン。テキストでも可能。 Opacity to Show Focus / デモ Color Changing Text an
Klaus Hartl - Stilbüro : jQuery UI Tabs aka Tabs 3
Being a part of the jQuery UI project, UI Tabs aka Tabs 3 has been released the other day. Until today I have fixed a bunch of bugs that popped up and I hope Tabs 3 is stable now. I’ve added a couple of frequently requested features but please be aware that the new Tabs require jQuery 1.2.1 and also that I have left away history support for now. The history plugin itself needs a major overhaul and
jQuery版のLightBox「ThickBox」
jQuery版のLightBox「ThickBox」 ThickBoxはLightBoxのjQuery版とも言えるJavaScriptライブラリで、画像をクリックするこのにより拡大画像を表示させることが可能です。 LightBoxがprototype.jsをベースに開発されたjsライブラリであるのに対して、ThickBoxはjQueryをベースに開発されています。 設置方法 配布ページよりjquery.jsとloadingAnimation.gif、thickbox.css、thickbox.jsというファイルをダウンロードし、ThickBoxを利用したいhtmlのhead要素などでそれらのファイルを読み込みます。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...%25EF%25BC%258BslideUp()%25E3%2581%25AE%25E4%25BD%25BF%25E7%2594%25A8%25E4%25BE%258B)
エフェクト操作：スライディング：slideDown()+slideUp()の使用例 | jQuery
IDEA * IDEA
trace
Ajax » jQuery APIリファレンス » jQuery Core：jQueryオブジェクト操作 | PHP & JavaScript Room
Lightboxスクリプトいろいろ - DesignWalker