様々なフォーマットにも対応可能な、美しい年表コンテンツを実装できるjQueryプラグイン・Timeline - かちびと.net
珍しいので一応メモ。年表を作れる jQueryプラグインです。見た目も 綺麗なんですが、スプレッドシート や、JSON形式にも対応出来るので どこかで使えるかも、と思いました。 機能も申し分ありません。 多用するようなものでもありませんが、スプレッドシートの情報を読み込むのは面白いですね。 綺麗です。上にコンテンツ、下に年表があって、ツールチップ形式でタイムラインが形成されます。ツールチップをクリックするとスライドが動く、というインターフェース。 年表は伸縮できますので見難い、というストレスも感じさせません。また、広がる時のアニメーションもスムーズで気持ちいいです。 全画面にしたり、GoogleスプレッドシートやJSON形式のデータを読み込んでタイムライン化する事も可能みたいです。この点は結構便利では無いかと。 Sample コード<script type='text/javascript
jQuery.gpFaviconでリンクにアイコンを付けられます。 | Ginpen.com
概要 リンクの内容からファビコン (Favicon)のURLを自動判断し、画像を挿入します。 ダウンロード jQuery.gpFavicon-1.0.zip [57KB] 基本的な使い方 .gpFavicon()を実行するとその中からリンクを探してURLを解釈し、ファビコンを表示させます。画面全てのリンクを対象にする場合は$(document)に対して実行します。 $(document).gpFavicon(); $(elem).gpFavicon(); また個別のリンクに対して .gpFavicon()を実行すると、そのリンクだけを対象にファビコンを表示します。 $(link).gpFavicon(); デモ デモ1 : 基本的なもの Demo 1 各リンクにファビコンを表示させます。 ファビコンが見つからない場合はデフォルトのアイコンを表示します。 自身のサイトにはファビコンは表示しま
【作ってみた】スクロールで要素が登場するとハイライトしてくれるjQueryプラグイン「scrollHighLighter」
HOMEHTML/CSS【作ってみた】スクロールで要素が登場するとハイライトしてくれるjQueryプラグイン「scrollHighLighter」 この記事は10年以上前の記事です。情報が古い場合がありますのでお気を付け下さい。Webサイトを閲覧していると、一体どこがクリック出来るエリアなのか分からないことがあります。 このプラグインは、画面をスクロールしていって、該当の要素が画面内に登場するとハイライトしてくれるというプラグインです。 デモ ダウンロード 仕組みとしては、指定した要素の上にdivの透明レイヤーを配置して、ハイライト時に一瞬だけ表示という方法で実現しています。 もともとはaタグにバインドして利用することを想定していましたが、他の任意の要素にもバインドできます。 基本的な使い方 html <script src="js/jquery-1.4.4.min.js" languag
jQuery Clip - jQueryのプラグインをまとめました。
jQueryの便利で実用的なイメージスライダーやレスポンシブ対応のプラグインをタグやカテゴリで見やすくまとめました。
h1〜h6で作った文書の階層を元にメニューを自動生成してくれるjQueryプラグイン「pageMenu」:phpspot開発日誌
h1〜h6で作った文書の階層を元にメニューを自動生成してくれるjQueryプラグイン「pageMenu」 2011年07月07日- $ pageMenu plugin 0.0.2 | jQuery Plugins h1〜h6で作った文書の階層を元にメニューを自動生成してくれるjQueryプラグイン「pageMenu」 HTMLでH1〜H6で綺麗に階層的に文書を記述しておくと次のようなページメニューを自動で作ってくれてページ内リンクしてくれるというものです。 自分で作ると文書追加の際に修正しなくてはならず、漏れも発生しそうですが自動でやることでその心配や手間はゼロになります。 初期化もカンタン。 jQuery('h2').pageMenu(); 綺麗にHTMLを書いている方はこの1手間でかなり使いやすくなりますね 関連エントリ iOSのシェイクイベントを取得できるjQueryプラグイン「gS
The Foolproof Guide to Crypto Wallet Security in 2022
Be sure to check out Duet - Professional project management hosted on your own server! Beautiful Project Management & Billing Software The cryptocurrency world is growing so fast that it’s challenging to keep up. Between 2021 and 2022, the volume of crypto transactions skyrocketed by almost 600%. It’s not hard to see that cryptocurrency has surged out of the niche corners of finance to be an incre
HTML5のデスクトップ通知を簡単に扱えるjqueryプラグイン「desktopify」。:phpspot開発日誌
HTML5のデスクトップ通知を簡単に扱えるjqueryプラグイン「desktopify」。 2011年05月26日- DESKTOPIFY Aquaron HTML5のデスクトップ通知を簡単に扱えるjqueryプラグイン「desktopify」。 このライブラリを使うことで簡単にjquery風の記法でデスクトップ通知が出来るようです 試しに、入力して送信してみると。 という具合にChromeだと表示されます。 通知していいかどうかも聞かれるのでそこを一度許可すれば、便利な通知として使えます。 LightBox的通知もいいですが、わかりやすさでいえばこちらもいいですね。 関連エントリ JavaScriptエラー時にエラーを分かりやすく通知してくれるChrome拡張「JavaScript Errors Notifier」 ブラウザに分かりやすい通知を送れるスクリプト色々 利用者に対し非常に分か
fieldset要素単位で横スライドするバリデーション付きの入力フォーム用jQueryプラグイン・jQuery Stepy - かちびと.net
縦長になるような入力フォームにいいかな と思ってメモ。fieldsetでグループ化された 要素単位でスライド化してくれます。下部 までスクロールする必要が無くなるのと、 どこが誤入力か分かりやすい、場所を取ら ないなどのメリットがあります。 特に、入力項目が長いフォームは離脱率を高くする可能性も否めませんので、入力プロセスを補助するのはユーザビリティに大きく貢献出来るかと思います。IE6でも7でも動作するようです。 日本語に直してみました。これは1例で、3つに分けなければならないわけではありません。 入力をミスすると、次のfieldset要素に進めない（スライドできない）という仕組み。 fieldsetごとにバリデーションチェックを行うのでユーザーもストレスが無いような有るような。 うん、ストレス無いです。（ｷﾘｯ ファイルとか <script type="text/javascript"
複雑なデータ構造のJSONを扱う際にCSSセレクタ風にアクセスできて超便利な「JSONSelect」:phpspot開発日誌
複雑なデータ構造のJSONを扱う際にCSSセレクタ風にアクセスできて超便利な「JSONSelect」 2011年05月25日- JSONSelect 複雑なデータ構造のJSONを扱う際にCSSセレクタ風にアクセスできて超便利な「JSONSelect」 jQuery成功の背景には、そのDOMへのアクセスのしやすさがひとつの要因だと思いますが、JSONSelectを使うと、JSONデータへのアクセスをCSSセレクタっぽく、jQueryっぽく簡単にアクセスできます。 例えば、次のようなJSONデータがあったとしましょう。 JSONSelectで、「.languagesSpoken .language」として選択すると、次のように要素を選択できます。 例えば、検索結果などで、同じ構造の要素がリストとして帰ってくるようなケースにおいて、同じ名前の属性リストをサクッと取得可能。 上位階層が指定できるた
使い道色々。jQueryを使ってSparklineグラフを描く·Peity MOONGIFT
PeityはjQueryでSparklineグラフ（円、棒、折れ線）を描くJavaScriptライブラリ。 PeityはjQuery/JavaScript製のオープンソース・ソフトウェア。Webサイトはテキストコンテンツが多い。一覧表などはテーブルタグを使えば簡単に実現できるが、それをグラフ化しようと思うと面倒に感じてしまうからだろう。 円グラフ だがライブラリを使えば容易に実現できる可能性がある。Canvasタグを使ってSparkline系グラフを描くライブラリがPeityだ。 Sparklineとは一行程度の小さなグラフで、縦軸横軸の説明は行わない。そのような説明がなくとも十分理解できるグラフについて使われる。ごく小さいので文章中に埋め込むのも容易だ。Peityでは円グラフ、折れ線グラフ、棒グラフの三種類を描くことができる。 折れ線グラフ タグの中に埋め込まれた文字を使ってグラフにして
年表作り等に使えるタイムライン実装用jQueryプラグイン「timeglider.js」:phpspot開発日誌
Timeglider jQuery Plugin/Widget 年表作り等に使えるタイムライン実装用jQueryプラグイン「timeglider.js」。 マウスでドラッグ＆ドロップしたり、拡大できたりする年表のUIを提供してくれます。 例えば、どういうJavaScriptライブラリが何年に登場したのか、みたいなものを表示するのに使えます。 誰がいつ入社したのか？といった時系列のデータの表示なんかにも使えそう。 年代なんかも表示できます。 更にアイテムをクリックした場合には注釈を表示することも出来ます。 あまり使う機会はないかもしれませんが、こうしたライブラリはそれほど多く無いので覚えておいても損はなさそうです。 関連エントリ PHP・CSS・jQueryを使った横向きのタイムライン実装例 HTML5ビデオの内容に併せて他コンテンツを連動させて切り替えられるフレームワーク「Popcorn.
[JS]HTMLコンテンツにも対応、カルーセルで表示するスライダーのスクリプト -jShowOff
一つ以上の子要素と、それらを内包する親要素をスライダーとして使用します。 下記は、テキストや画像を配置したdiv要素を子要素として、それらを内包するdiv要素を配置しています。 <div id="features"> <div><p>This is a slide!</p></div> <div><a href="http://google.com"><img src="http://www.google.com/intl/en_ALL/images/logo.gif" alt="Google Logo" /></a></div> </div> JavaScript 「jquery.js」と「jquery.jshowoff.min.js」を外部ファイルとし、下記のスクリプトを記述します。 セレクタ（#features）は、自分の環境にあわせて変更してください。 $(document).re
SmartColumnScroller plugin for jQuery
Description In multicolumn page layout, automatically scrolls smaller (lower) column so user never sees white space underneath. Usage jQuery(window).load(function () { jQuery('#myDiv1, #myDiv2').smartColumnScroller(); }); Recommendation Start plugin processing in 'window.load' event and not in 'document.ready'. Source code Source code is available on https://github.com/dhlavaty/jQuery-SmartColumnS
[JS]多彩なカスタマイズ、設置も簡単な画像の一部を拡大するスクリプト -Zoomy
画像の一部を拡大するスクリプトは数多くリリースされていますが、その決定版ではないか、というjQueryのプラグインを紹介します。 Zoomy デモページ [ad#ad-2] Zoomyの設置 Zoomyのオプション Zoomyの設置 Zoomyの設置は簡単で、ユーザビリティにも配慮されています。 使用する画像ファイル ページに配置する画像、拡大時に使用する画像、の2枚が必要です。 外部ファイル 「jquery.js」とZoomy用のJS, CSSファイルを外部として記述します。 <link type="text/css" rel="stylesheet" href="path-to/zoom.css"/> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.
使いやすくデザインもよい星型レーティング実装jQueryプラグイン「jRating」:phpspot開発日誌
MyjQueryPlugins : jRating - Ajax rating system with jQuery 使いやすくデザインもよい星型レーティング実装jQueryプラグイン「jRating」。 デザインは次のように、綺麗な星のデザインになっており、個性が強すぎず、弱すぎずという感じで汎用に使えそうです。 isDisabledオプションを true にすると、星だけ表示して投票禁止にすることも出来るので、ログインユーザのみに限定したい場合なんかにも使えそうです。 更に次のような小さな星にすることも出来ます。 次のように、成功、失敗時のイベントハンドラを設定することも可能。 $(".exemple6").jRating({ onSuccess : function(){ jSuccess('Success : your rate has been saved :)',{ Horiz
ブラウザに分かりやすい通知を送れるスクリプト色々:phpspot開発日誌
あけましておめでとうございます。 今年も淡々と更新をしていきます。よろしくお願い致します。 今年一発目のエントリはブラウザに分かりやすい通知を送れるスクリプトを色々とまとめてみました。 jNotify ページ全体がグレーアウトし、メッセージが強調表示されます。 他の操作がしばらくできないので、確実にメッセージを読んでもらえるようにできます。 アイコンの変更や、メッセージにHTMLを使うことも可能。 Notimoo ページの右上なんかにフェードインしながらブロックをアニメーション表示させられるJSライブラリ。 複数メッセージを連続して出すことが出来ます。 jQuery Notify bar Twitterの通知バーっぽいＵＩでユーザ通知できるjQueryプラグイン。 これも非常に分かりやすい通知が行えます。 jQnotice 吹き出しっぽいデザインで通知が行えます SlideNote 指定位
list_index.js 50音索引生成Javascriptライブラリ : トラねこblog
2010年11月01日17:57 カテゴリkuwa list_index.js 50音索引生成Javascriptライブラリ すっかりご無沙汰しております。kuwaです。 list_index.js 50音索引生成Javascriptライブラリを公開致します。 以下、配布ページから引用した本ライブラリの特徴です。JSON形式のリストを元に、50音索引とリストを生成、表示します。 「ア・カ・サ・タ・ナ･･･」で絞り込んだ後「ア・イ・ウ・エ・オ」でさらに絞り込めます。 jQuery依存です。 Ajax等であとから項目を追加できます。 画面内に複数設置可能。独立して動作します。 「ヴァ・ヴィ・ヴ・ヴェ・ヴォ」は「バ・ビ・ブ・ベ・ボ」に対応し、「ア行」と「ハ行」の両方に表示されます。 見た目は全てcssで制御。 coneco.netのファッションカテゴリで、ブランドによる絞り込み機能があるのですが
www.jolfizetok.hu
Olyan elit cégcsoportot hoztunk létre 2007-ben, akik önként vállalták, hogy egymásnak határidőre kifizetik számláikat. Így léptünk fel az akkor nagy méreteket öltő körbetartozások (lánctartozások) ellen. Kezdeményezésünkhöz rövid időn belül magánszemélyek és pártoló tagok is csatlakoztak. Több szolgáltatásunk közül mobiItelefon fIotta szolgáltatásunk a legnépszerűbb, mert alacsony árú előfizetői c
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Downloads | CSS-Tricks
5509.me