jQueryで時間をカウントダウンするJavaScript「jCountr」
twitter facebook hatena google pocket ティザーサイトなどで、あと何秒でオープンみたいな表示があります。 JqueryプラグインjCountrを使用すると似たようなカウントダウンが可能になります。 sponsors 使用方法 jCountrからjquery.jCountr.jsをjQueryからjquery.jsをダウンロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="jquery.jCountr.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#id名").counter({ hou
jQueryでマウスオーバーを印象的にする：jQuery Animated Menu
twitter facebook hatena google pocket マウスオーバー時に効果を与えることは当たり前になっていますが、もうちょっと工夫をするとユーザーの興味を喚起できるかもしれません。 jQueryの.hoverという基本的な手法を利用して、マウスオーバーを印象的にする小ネタです。 via：jQuery Animated Menu sponsors 使用方法 今回はサンプルとしてメニュー的なhtmlを記述してみます。 <ul id="menu"> <li class="home"><a href="#">home</a></li> </ul> CSSは以下とします。 ul#menu {height:81px;margin:0;padding:0;} ul#menu li a {display:block;height:81px;width:159px;text-inde
jQueryでエクスプローラ風メニューに！ (1/2)
ネットショップや情報サイトなど、複雑な階層構造のWebサイトでは、なるべく分かりやすくて見栄えのいいナビゲーションを設置したい、というニーズがあります。今回は、jQueryプラグインのひとつ、「Treeview」を使って、リストをツリー風に格好よく表示する方法を紹介しましょう。 ui／li要素をツリー表示する「Treeview」 Treeviewプラグインは、HTMLのul／li要素でマークアップしたリストをツリー風に表示するJavaScriptです。要素をクリックで開閉したり、Windowsのエクスプローラのようなフォルダ／ファイルアイコンを表示したりと、いろいろカスタマイズできるのが特徴です。開発者はJorn Zaefferer氏（Jornの「o」の上に点が2つ付きます）で、MITライセンスで公開されています。 Treeviewプラグインは、以下のページで配布されています。ページの先頭
THAT Blog: Digital & Inbound Marketing | Web Design WPB
Google Ads for Car Dealerships: Boost Test Drives with These Proven Campaigns Jun 27, 2025 1:30:00 PM If your dealership isn't running Google Ads, you could be missing out on a ton of potential test drives. Today, most car shoppers start their search online, and Google is usually the first stop. That's where Google Ads for car dealerships can make a difference. With the right campaigns, you can ge
Create a Simple CSS + Javascript Tooltip with jQuery
It's always a joy to understand how things work. Well, at least I do. Alright, this time, I want to share with you all, how to create a simple jQuery tooltip. In this website, I'm using a script I grabed it online, and it uses onmouseover and onmouseout. It's really messy and annoying me. So, it's jQuery comes to rescue. The way it works is fairly simple, I use the Anchor tag REL and TITLE attribu
角丸もグラデーションも付けてしまうJavaScript「Round Corners jQuery Plugin」
twitter facebook hatena google pocket 最近は角丸やグラデーションが多用されていますが作るのはなかなかの手間です。 JavaScriptのRound Corners jQuery Pluginを使用すると、そんな手間を省くことが出来ます。 sponsors 使用方法 Round Corners jQuery PluginからroundCorners.jQuery.jsをjQueryからjqueey.jsをダウンロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="roundCorners.jQuery.js"></script> <script> $(document).ready(functio
JavaScriptで任意の場所にスクロールバーを付ける·jScrollPane MOONGIFT
JavaのSwingにあるJScrollPaneクラス。ウィンドウをはじめとした他のコンポーネントにスクロールバーの機能をつけることができる。これにより狭い範囲であっても多くの情報を載せられるようになる。 スキンにも対応したスクロール機能を提供する Webページでもそれは同様だ。溢れてしまった文字の扱いをどうするかCSSで設定するのがoverflowだが、それをもっと高機能にしたのがjScrollPaneだ。 今回紹介するオープンソース・ソフトウェアはjScrollPane、jQueryプラグインのスクロールプラグインだ。 jScrollPaneはDivタグに対して使う機能で、文字がはみ出した場合にスクロールバーを付けてくれるプラグインだ。スキン機能に対応し、Windows XP風やMac OSX風を使えたり、スクロールバーを一般的な右側でなく、左側にもうけることもできる。 多段のスクロー
Ajax » jQuery plugin » ウィンドウ、モーダル | PHP & JavaScript Room
［CSS］jquery.jgrowl.css ［JS］jquery.js v1.2.6、jquery.jgrowl.js Mac OS XのGrowl風に、メッセージを半透明の角丸ボックスに表示するjQueryプラグイン。 メッセージは、一定時間経過するとフェードアウトしながら消えていきます。 2つ以上メッセージを表示した場合は、一括で閉じるリンクが表示されます。 オプションで、メッセージの表示時間（単位：ミリ秒）、ヘッダ付き、閉じるボタンをクリックするまで表示するなどの設定もできます。 メッセージボックスが閉じられようとしている時などのイベントも取得することができます。 設置イメージ jGrowlの設置サンプルサンプルを見る<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3
jQueryを使って作るシンプルなモーダルダイアログ:phpspot開発日誌
Simple JQuery Modal Window Tutorial | Queness jQueryを使って作るシンプルなモーダルダイアログ。 jQuery単体で、ライブラリを使わずにLightBoxのようなモーダルダイアログを実現する方法です。 JavaScript45行ぐらいで、これを実現できてしまっちゃっているところが、jQueryのシェアの要因かもしれません。 シンプルなモーダルダイアログ なかなか凝ったログインダイアログ 貼り付けメモ風 仕組みとしては、グレー背景や、ダイアログ等、あらかじめ必要なHTMLエレメントとCSSは定義しておいて非表示にし、jQueryによってshow,hideしているというものです。 実際に使える有用なサンプルとしてではなく、よいjQueryの教材としても使えるかもしれませんね。 関連エントリ 便利なjQueryプラグインいろいろ ナビゲーションの
関連性をビジュアライズするJavaScript「jConnecter」
twitter facebook hatena google pocket WEB上で「AとBは関連性があるがCとはない」と表現することがあった場合、画像編集ソフトを使用するしかありませんでした。 jQueryプラグインのjConnecterを利用すると、簡単に表現することができます。 sponsors 使用方法 jConnecterからjConnecter.jsを、Canvas Text FunctionsからCanvasText.jsを、そしてjQueryからjquery.jsをダウロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="CanvasText.js"></script> <script type="text/jav
[jQuery]検索結果で表示可能なTwitterブログパーツを設置できる「Monitter」
Twitterの検索結果をタイムラインで表示するようなブログパーツってなかなかないですよね。 今回ご紹介するブログパーツは、jQueryで動かす割には設定がほとんど不要で、Twitter検索結果も表示できる手軽で便利なものになっています。 組織のマインドマップツールをマインドマイスターにすべき理由 伸びてる産業、会社、事業を紹介しまくるStrainerのニュースレターに登録!! Twitter検索結果で表示できるjQueryブログパーツ「Monitter Widget」は、jQueryを使って設置でき、Twitter検索結果でも表示できるブログパーツ。 検索キーワードをブログパーツを表示するdiv要素のtitle属性に書くだけで良いので、設置もかなりカンタンです。 「Monitter」の特徴title属性が検索クエリになるlang属性で言語の絞込み可能シンプルなCSSでデザイン設定可能ここ
![[jQuery]検索結果で表示可能なTwitterブログパーツを設置できる「Monitter」](https://cdn-ak-scissors.b.st-hatena.com/image/square/7e3e2e47a03287d215e0563cc28cb00978a7644a/height=288;version=1;width=512/http%3A%2F%2Fweb-marketing.zako.org%2Fimages%2F2009%2F03%2Fmonitter.png)
[JS]ページを多言語に翻訳するスクリプト＆ブックマークレット -Sunday Morning
Google AJAX Language APIを利用して、ページ内のテキストを30以上の言語に自動翻訳するスクリプト&ブックマークレット「Sunday Morning」を紹介します。 Sunday Morning jQuery + Google Translation デモでは、ダブルクリックでナビゲーションを表示してインラインのテキストを翻訳するものと、単語単位で翻訳するものがあり、サイトのテキストもダブルクリックすると翻訳されます。 ブックマークレットは、下記ページにて作成することができます。 SundayMorning Bookmarklet Generator Sunday MorningはjQueryのプラグインのため、実装にはjquery.jsが必要です。
これでサイトに独自の右クリックメニュー実装は誰でも簡単「jQuery Context Menu Plugin」:phpspot開発日誌
これでサイトに独自の右クリックメニュー実装は誰でも簡単「jQuery Context Menu Plugin」 2009年03月12日- jQuery Context Menu Plugin これでサイトに独自の右クリックメニュー実装は誰でも簡単「jQuery Context Menu Plugin」。 ちょっと前までだと独自の右クリックメニューを作るのはすごく大変でした。特にクロスブラウザで動作することなんかを考慮すると本当に大変でした。 が、このライブラリを使えば簡単に実装できてしまいます。 特定のエレメント上のみに右クリックメニューを設定できるという、柔軟なつくりになっています。 どのアイテム上でクリックしたかっていうのがイベントハンドラで受けられるところも汎用的になっていていいです。 このライブラリ１つとってみても、jQueryを使う意味が出てきそうです。 jQueryは本当にデフ
画像を使わずに角丸を描画する『Liquid Canvas』 – creamu
「ruzee.com」で、HTMLのcanvas要素の中に描画できるJavaScriptライブラリ「Liquid Canvas」が公開されています。 ↑のような背景が作れてしまう、とのことですね。 デモは以下から見られます。 » Demo » basic example ブラウザはFx, IE6, Safari, Chromeでテスト済みとのことですね（ざっくりしていますが）。 ソースがダウンロードできるので、ぜひ見てみてはいかがでしょうか？ » Liquid Canvas ジョリーみたさに「トゥームレイダー 2」を見た。なかなかおもろかったね。でも最近の方がキレがある感じかな。 やること満載で混乱しています。今のサーバが海外からアクセスできない＞＜ので海外に行く前に移行しないといけなくてサーバはあそこにしようかな、とそれでメールサーバーはGoogleAppsを使おうと思ってるけどmxレコ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[JAVASCRIPT] Build a Better Tooltip with jQuery Awesomeness - クールなToolTip JS
Google Translate
[JS]ナビゲーションにツールチップをスライド表示させるスクリプト
[JS]a要素以外にも実装が可能なフレキシブルなツールチップのスクリプト -wTooltip
[JS]タブと連動するNext/Previousボタンを設置するスクリプト
[JS]一覧表示のレイアウトを切り替えるスクリプト -Easy Display Switch