)
Timespace - 時間に紐付いたイベントを表示するjQueryライブラリ MOONGIFT
世の中の多くのことは時間軸に沿って進んでいます。1日のスケジュールもそうですし、歴史も時間によって進んでいきます。そうした時間ごとに発生するイベントを表示するのに、単なる一覧ではなく、時間軸を使うと分かりやすくなります。 今回紹介するTimespaceは時間ごとに発生するイベントを表示するライブラリです。 Timespaceの使い方 利用しているところです。イベントをクリックしたり、次のイベントに移動するとアニメーションされます。 クリックしたイベントの詳細が下に表示されます。 説明があれば追加で表示されます。 Timespaceは時間ごと、または年ごとなどで表示できます。歴史年表などであれば年ごとでいいでしょうし、数日であれば時間ごとが最適でしょう。こういった表示が最適な場合は限られるので、Timespaceを覚えておくとさっと使えて便利です。 TimespaceはjQuery/Java
Home - AJ Hoffer
How To Unit Test With DateTime in C# Your code has compiled. Your unit tests are running. And then you see it. A unit test has failed. After some investigation, you realize the problem: somewhere in the code you have a dependency on something you don't control. The cuplrit? DateTime. ... Read more ~ posted in professional on 12.24.2020 Spruce Up Your List-Item Bullets with Emojis! If you want to a
Datepair for jQuery – Demos and Documentation
A jQuery plugin for intelligently selecting date and time ranges inspired by Google Calendar.jquery.datepair A jQuery plugin for intelligently selecting date and time ranges inspired by Google Calendar. Documentation Source code on GitHub Download (zip) Help Use this plugin to link date and time inputs when you need to select ranges. <p id="basicExample"> <input type="text" class="date start" />
Boostrap向けの日付/時間ピッカーを実装するスクリプト・bootstrap-datetimepicker
Twitter Boostrap用の日付/時間 ピッカーを実装する為のライブラ リ・bootstrap-datetimepickerの ご紹介。日付と時間を同じinput 要素内で取得できます。また、 フォーマットも指定可能です。 デート・タイムピッカーを実装するスクリプト。jQuery依存みたいです。 シンプルに日付と時間を取得するだけのものですが、別のinput要素を用意する必要が無いのはユーザーに優しいですね。 Sampleカレンダーの下部に時間ピッカーへの切り替えボタンがあります。 言語を日本語に指定したけどカレンダーはまだ日本語には未対応です。出力フォーマットは自由に設定できます。 コード<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.
数値だけでなく、日付や時刻にも対応したスライダー・jQRangeSlider
D&Dで操作するスライダーを実装するjQuery依存のスクリプトです。数値のものが多いですが、こちらは日付や時刻などにも対応しています。使うシーンは多くは無いかもですけど、便利そうです。 日付にも対応のスライダーです。※ピッカーではありません
flipCounter 1.2 a jQuery plugin by BloggingSquared.ca
Bare Bones For the everyday developer, nothing more than the essentials, pack'd, tar'd and vacuum-sealed in shrink wrap for a lightening fast downloading experience. Turbo Charged For those who like to tinker, get the uncompressed code, fully commented with a source PSD included so you can customize the look of your flipCounter. Usage FlipCounter is easy to implement, follow these steps: In your p
Animated Responsive Image Grid | Codrops
A jQuery plugin for creating a responsive image grid that will switch images using different animations and timings. This can work nicely as a background or decorative element of a website since we can randomize the appearance of new images and their transitions. Today we want to share a jQuery plugin for creating a responsive image grid with you. The idea is to have a list of images and define th
シンプルで見やすいガントチャートを描けるjQueryプラグイン・jQuery.Gantt
シンプルで見やすいガントチャート を描画できるjQueryのプラグイン。 以前見かけてから放置していたので 少し触って見ました。使う機会は 個人的には多くありませんけど、 覚えて置いて損はしないかと。 この手のはよく見かけますけど、今日のプラグインは個人的に使いやすい印象だったのでメモ。 こういうやつ。 サンプル作ったので宜しければご覧下さい。 Sample コード<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script> <script src="jquery.fn.gantt.js"></script>本体とプラグイン。 $(".foo").gantt({ scale: "weeks", minScale: "weeks",
[JS]実行のタイミング（開始時間・回数・リピートなど）を簡単に設定できるスクリプト -timing
JavaScriptにはsetTimeout(), setInterval()とタイミングを設定できるメソッドがありますが、より簡単にタイミング（遅延時間・回数・リピートなど）を設定できるjQueryのプラグインを紹介します。 timing — a jQuery plugin [ad#ad-2] デモを例に、スクリプトの使い方を紹介します。 スクリプトの準備 スクリプトを使用するには「jquery.js」と当スクリプトを外部ファイルとして記述します。 ※jQueryは1.2+対応で、.join()使用時は1.7+を。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/<preferred-version>/jquery.min.js"></script> <script type=
カウントダウン終了後に任意のコードを実行できる軽量jQueryプラグイン・jquery-countdown
カウントダウンタイマーの実装と 終了後に任意のイベントを発生 させられるjQueryのプラグイン、 jquery-countdownのご紹介です。 たまに見かけるやつですね。使用 頻度は高くは無さそうですけど。 ローンチ前のComing soonページなんかでたまに見かけるやつです。スクリプトも軽量です。 カウントダウンアニメーションを実装します。終了後にコードを実行させる事も出来ます。時計部分はCSSスプライトを利用した画像を使用しているようです。 動作サンプルサンプルです。再生ボタンで動作テスト出来ます。 日をまたぐようなカウントダウンならもう一工夫必要ですね。 <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script> <s
時間の入力を楽にすることが出来るjQueryプラグイン:phpspot開発日誌
Timepicker for jQuery 時間の入力を楽にすることが出来るjQueryプラグイン。 inputにカーソルを合わせると補完候補が出て、次のように選択できるようにすることができます クリックするとそのままテキストが入ります。 基本の時間をベースとして何分後かという表示をするようなカスタマイズも可能 サービスによってはうまくマッチするUIが簡単に作れそうですね。 関連エントリ ファイルアップロード関連のjQueryプラグイン１０ インラインサジェストを実現するjQueryプラグイン「jQuery.suggest」 Twitter OAuth認証をポップアップで行うjQueryプラグイン
円形で回転するタイマーを実装できるjQueryサンプル:phpspot開発日誌
Animated Circle Timer | jQuery Plugins 円形で回転するタイマーを実装できるjQueryサンプル。 １〜１０秒の間で指定して指定秒数をかけてタイマーを回すようなものが作れます。 CSS3を使っているので非対応ブラウザでは動きませんが、なかなか面白いサンプルだったのでご紹介です デモページはこちら プラグイン形式ではないのでブラッシュアップの余地はありますが、実験や勉強用にソースを見てみてもよいかも。 タイマー秒数はソースに直接書く感じのようです 関連エントリ タイマーを作る際に便利なjQueryプラグイン「jQuery Timer」 ファンシーなデザインのカウントダウンタイマー実装jQueryプラグイン「Fancy Countdown」 シャレオツなカウントダウンタイマーが実装できるjQueryプラグイン「The Final Countdown」
使うときだけ表示できるiOS風独自スクロールバー実装jQueryプラグイン「nicescroll」:phpspot開発日誌
使うときだけ表示できるiOS風独自スクロールバー実装jQueryプラグイン「nicescroll」 2011年11月02日- nicescroll : stylish scrollbars ios look-alike | jQuery Plugins 使うときだけ表示できるiOS風独自スクロールバー実装jQueryプラグイン「nicescroll」 OSによってスクロールバーデザインが違ったり、常に表示されていたりというのが当たり前でしたが、独自スクロールバーにするのが最近のトレンドっぽいですね。 今回紹介するプラグインを使えばiPhoneのあのスマートなスクロールバーをPCブラウザでも実現出来ます。 エレメントにカーソルを合わせると次のような独自実装のスクロールバーが現れます スクロールすると当然、スクロールバーの位置も変化 時間を置くと勝手にスクロールバーがフェードアウトで消えます。
[JS]表示位置の微調整も可能、キュートなデザインのツールチップを実装するスクリプト -grumble
テキスト量を自動判定してサイズを大きく $('#grumble4').grumble( { text: 'Whoaaa, this is a lot of text that i couldn\'t predict', angle: 85, distance: 50, showAfter: 4000, hideAfter: 2000, } ); ); callback関数も用意されています。 $('#myElement').grumble({ showAfter: 1000, hideAfter: 2000, onShow: function(){ console.log('triggered when show animation completes'); }, onBeginHide: function(){ console.log('triggered when hide anima
サイト内で動くデジタル時計を実装するためのjQueryプラグイン「Clock」:phpspot開発日誌
jQuery Dynamic Clock Plugin | jQuery Plugins サイト内で動くデジタル時計を実装するためのjQueryプラグイン「Clock」。 ちょっとサイト内で動く時計を作りたい場合に、$(element).clock() とやるだけでデジタル時計がエレメント内に現れるという便利なプラグインです。 次のような時計が作れます。CSSデザインなのでデザイン調整は簡単ですし、フォーマットもオプションで簡単に調整できます デモサイトはこちら PCに時計あるからと思っていても時計を表示していない環境とかもあり、実装したいというニーズがあるときにサクっとやっちゃえるので便利かもしれませんね。 関連エントリ 独自デザインselectボックス実装時に使えそうなjQueryプラグイン「EasySelectBox」 タイマーを作る際に便利なjQueryプラグイン「jQuery T
タイマーを作る際に便利なjQueryプラグイン「jQuery Timer」:phpspot開発日誌
jQuery Timer Demo タイマーを作る際に便利なjQueryプラグイン「jQuery Timer」。 単純に、指定エレメントの値を指定秒数で＋していくタイマーの実装がjQueryのプラグイン形式で簡単にできるものです。 setIntervalとかでやっちゃえばいい話なのですが、オブジェクト指向っぽく使えて後から見たときのコードも分かりやすくできます。 var myTimer = $.timer(); myTimer.set({ action : function() { alert('This message was sent by a timer.'); }, time : 5000 }).play(); myTimer.set(options); myTimer.play(); myTimer.pause(); myTimer.toggle(); myTimer.once(
ファンシーなデザインのカウントダウンタイマー実装jQueryプラグイン「Fancy Countdown」:phpspot開発日誌
ブロックサイズ内に画像を綺麗に収めるjQueryプラグイン「CJ Object Scaler... 次の記事 ≫：ストライプ等、Photoshop用の４００個のパターンまとめ Fancy Countdown ファンシーなデザインのカウントダウンタイマー実装jQueryプラグイン「Fancy Countdown」 何らかのカウントダウンというと、待ち遠しかったりするもので、単純にテキストだけでカウントダウンしても面白みが少ないですね。 ということで、次のようなデザインのカウントダウンタイマーがjQueryで簡単に実現可能です。 あと何日でサイトオープン！みたいなティザーサイトを作る場合にも使えそう。 $(function() { $("#anyID").fancyCountdown({ 'year':2011, 'month':05, 'day':13, 'hour':13, 'minute
7 Awesome jQuery Countdown Scripts That Will Power Up Your Conversions | Tripwire Magazine
7 Awesome jQuery Countdown Scripts That Will Power Up Your Conversions by Lars | Last updated Feb 12, 2017 | Javascript, jQuery Plugin Collections | 42 comments Using jQuery Countdown Scripts is a simple and performance optimal way to add a dynamic and interactive countdown timer to your website. I am sure you have noticed the countdown features on e.g. sport sites showing countdown until a big ev
Davor Spasovski / Web Developer
spriteTimer is a jQuery countdown/countup timer plugin that uses a CSS sprite for the numeric digits and punctuation. The examples below are done using Rosewood font at 72pt so you'll most likely want to change this to the font, color, and size of your choice. Please refer to the demo pack for more examples including the sample numbers.png so that you know how to slice your own image sprite. Chang
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
