tableのヘッダ固定やソートとかのAjax系ライブラリまとめ - Cyokodog :: Diary
１週間かけて食中毒もなんとか直ったのでブログ再開します。（もうこりごりです....） 例のごとくはてブをすっきりさせたいのでtable関連のリンクをこちらにまとめてく予定です。まだまだありそうですが、おいおい追加してきます。 コアライブラリ非依存系 Table Sorter ソート | MOONGIFT | demo table sorting ソート | to-R | demo OrderByColumn ソート | PHPSPOT | demo sorttable ソート | MOONGIFT | demo SortedTable ソート | demo TableKit ソート、編集 | PHPSPOT | demo Tiny Table ソート、縞々、ページング | coliss | demo Scrollable HTML table ヘッダ固定 | PHPSPOT | demo
jquery.tablefix.js
»Download jquery.tablefix.js は、Excel のウィンドウ枠固定のように、テーブルのヘッダや左側を固定して、残りの部分をスクロールさせるための、jQuery プラグインです。 JavaScript 無効時はただのテーブルとして普通にそのまま表示される点と、他の類似品と違ってソート変更などの高度な機能がない代わりに、すでにデザイン済みの任意のテーブルにそのまま適用出来る点が特徴です。 読み込むのはプラグインだけで、追加の css や画像ファイルは必要ありません。 使い方 普通にテーブルをデザインする jQuery とプラグインを読み込む jQuery のセレクタでテーブルを選択して、プラグインを呼び出す これだけで、あとはプラグインがよかれにやってくれます。 プラグインの呼び出し方 $('tableSelector').tablefix({width: 600,
Ikemasa Blog - JavaScriptでウィンドウオブジェクトを名前で参照する場合のまとめ
Webブラウザにおいて、JavaScriptで window.open() の戻り値は、開いた子ウインドウオブジェクトの参照です。 var win = window.open(”url”, "windowName"); // win は子ウィンドウオブジェクトの参照 子ウィンドウからは、 window.opener で親ウィンドウオブジェクトを参照することができます。 また、ウィンドウ名からウインドウオブジェクトを参照することもできます。 Gecko DOM リファレンスの window.open には、ウィンドウ名からウインドウオブジェクトを参照する方法が記載されています。 url に空文字列を与えることは、ウィンドウのロケーションを変えずに、その名前によって開いたウィンドウの参照を得るための手段です。 window.open – Gecko DOM リファレンス たとえば、Windo
今さらながらJavaScriptのwindow.openについて調べてみた。 - 小さい頃はエラ呼吸
はじめに JavaScriptで新規ウインドウを表示するコードを書いていて、ちょっとつまづいたので、今さらながらJavaScriptのwindow.openや親子ウインドウの制御について調べてみました。※以下のコードはすべてIE7で検証しています。 ノンプログラマのためのJavaScriptはじめの一歩 (WEB+DB PRESS plus)posted with amazlet at 13.01.23外村 和仁 技術評論社 売り上げランキング: 17,179 Amazon.co.jp で詳細を見る window.openメソッドの使い方 window.openメソッドの第１パラメタには、表示するファイルを指定します。第２パラメタにはウインドウの名前、第３パラメタには、子ウインドウに対するオプションを指定します。第１パラメタ以外は、省略可能です。（ちなみにwindow.の部分も省略可能です
JavaScript: window.open() 小窓の基礎
window.open()で小窓 いわゆる小窓です。これはJavaScriptの window.open() というメソッドで 小窓となるウィンドウを生成します。 各引数の文字列は一重引用符または二重引用符で括って指定します。 第１引数「URL」は生成されるウィンドウに表示するページのURLです。 ※ ウィンドウに表示するページ（別のファイル）は別途作成して用意しておきます。 第２引数「ウィンドウ名」は特に指定する必要がなければ null で良いでしょう。 ウィンドウ名を指定するときは引用符で括ります。 ※ null を指定するとウィンドウ名の設定されていない新規ウィンドウとなります。 (HTMLの属性 target="_blank" と同等です) 例: window.open('example.html', null); 第３引数「オプション」はウィンドウの特徴を設定する文字列です。 こ
【JavaScript】IEで確認ダイアログを表示せずに画面を閉じる
IEでJavaScriptの「window.close」使って画面を閉じる際に、 親ウィンドウを閉じようとすると、 「ウィンドウは、表示中のWebページにより閉じられようとしています。 このウィンドウを閉じますか？」 という確認ダイアログが表示されます。 (親ウィンドウから子ウィンドウを閉じる場合は確認ダイアログは表示されません) この確認ダイアログを表示させなくする方法があります。 IE6場合は以下のコードで実現出来ます。 window.opener = true; window.close(); 通常のウィンドウを閉じる「window.close」の前に、 「window.opener」の中に何か加えると、 確認ダイアログは表示されずに閉じる事が出来ます。 これはIEが「window.opener」の中身がnullか否かで、 親ウィンドウなのか子ウィンドウなのかを判断している事を利用し
別ウィンドウを最大化で開く | ひとぅブログ
Javascriptで新しいウィンドウを開くために、window.openを利用しますが、制作者側として画面サイズ最大で別ウィンドウで開きたい場合があります。（利用者側からすればありがた迷惑、というご意見も多々ありますが。） そう言った場合、ディスプレイのサイズを測定し、その数値から開くウィンドウの大きさを指定するという面倒な方法を取っていましたが、もっと簡単な方法があることをつい先日知りました。 IE4以降のようですが現状なら特に問題なさそうです。 ただ前述の通り、制作者側が利用者の環境を無視し、新しいウィンドウをいきなり最大化で開くのはマナー違反です。 イントラネットや限られた利用者の場合に限るなどの工夫が必要です。 以下にサンプルソースを掲載しておきます。 サンプル１：画面サイズを測定しできるだけ大きなサイズでウィンドウを開く <script type="text/javascrip
tableの行と列を固定してスクロール！！Super Tables | バシャログ。
6月に入り、欧州サッカーの移籍情報が気になってしょうがないishidaです。 WEB制作に携わっていると、表組みだらけのWEBサイトの担当に 長い人生に一度や二度はなる（?）と思います。 tableによる表組みは、行や列が増えすぎるとコンテンツからはみ出したりして 見栄えが悪くなりますよね。 そんな迷える子羊たちを助けてくれるjavascriptライブラリ Super Tables を今回ご紹介いたします。 まずは以下のサンプルをご覧くださいませ。 Super Tables サンプルデモ サンプルのような感じで、ヘッダー部分を固定したり、列を固定できます。 Super Tables 設置方法 配布ページよりデータをダウンロードし、利用したいhtmlのhead要素などでファイルを読み込みます。 <link rel="stylesheet" href="superTables.css" typ
jQuery 開発者向けメモ - 基本・サンプル
基本 jQueryとは jQuery は様々な処理を短く簡単に書ける JavaScript ライブラリです． 独自のXPATH/CSSセレクタを利用することで，多くのDOM操作を非常に簡単に書くことが出来ます． JavaScriptのDOM操作や，XMLHTTPRequest，XMLの操作などを覚えなくとも， Ajaxを利用したインタラクティブなページを作ることが出来ます． 以下のサンプルを見れば，JavaScriptらしい表記をほとんどする必要がないことがわかると思います． toggleサンプル 特定のブロックの表示・非表示を切り替えるのは以下のようなコードになります． $("#target_toggle").toggle("slow"); このブロックは，<p id="target_toggle"> です． Ajaxサンプル Ajaxでhello.htmlをロードするのは以下のようなコ
コピペで使える言語・コマンドリファレンス - ITproリファレンス：ITpro
HTMLやCSS、DynamicHTML、JavaScriptやPerl、Windowsコマンド、ネットワークコマンド、Linuxコマンドといった、Webサイト構築やアプリ開発に欠かせないプログラミング言語とコマンドのリファレンスマニュアルです。各項目のサンプルコードは、コピーし貼り付けてすぐに使えます。入門講座も用意しました。ぜひブックマークしてお役立てください。 HTML HTMLは、Webコンテンツを作成する上で、最も基礎となる記述言語です。各タグについての概要や属性などをサンプルを交えて説明します。 HTMLリファレンス（107項目） HTMLリファレンスの使い方 HTML入門 CSS CSSは、Webページのレイアウトなどといったコンテンツの見栄えを指定する記述言語です。各スタイルの概要や使い方を説明します。 CSSリファレンス（73項目） CSSリファレンスの使い方 CSSの基
入力支援ツール「Google Scribe」のブックマークレットが便利すぎる | ライフハッカー・ジャパン
「Google Scribe」は、Googleサジェスト機能をどこでも利用できるサービスです。 もちろん、Google Scribe上でも動きますが、用意されているブックマークレットが非常に便利。これを利用すれば、どんな場所でもGoogle Scribeが使えます。 以下に使ってみた様子を載せておきます。 Google Scribeにアクセスして、文字を入力してみましょう。現在は、英語しか対応していません。 このように次の候補や、入力している単語を自動的に補完してくれます。かなり高速で、もたつかないところは流石ですね。 補完してくれる内容は、英単語だけでなく、HTMLなどのコードも対応しています。また、Googleアカウントにログインしている状態だと、ユーザ履歴にもとづいて候補がでてくるようです。 Google Scribeの下部にブックマークレットがあります。こちらをブックマークに保存し
JavaScript初級者から中級者になろう
JavaScript。「ジャヴァスクリプト」と読みます。主にWebページに動きを与えるものです。 現在では結構多くのページに使われていますが、その多くはとてもレベルが低く不適切なものです。もっと質の高いJavaScriptを使える人が増えるといいなという思いから、このページを作りました。 初級者の基礎知識 本文を理解するにはJavaScriptの知識がそれなりに要るので、JavaScriptがそもそもあまり分からない人は、この辺を読んでみましょう。 基礎第一回 基礎第二回 基礎第三回 基礎第四回 基礎第五回 基礎第六回 第一章 オブジェクト オブジェクトとは オブジェクトの実体 配列のコピー オブジェクトと関数 第二章 DOMの基礎 HTMLと木構造 DOMとは 基本的な操作とテキストノード 木構造の操作：ノードの除去 木構造の操作：ノードの追加 木構造の操作：さまざまな機能 木構造の操作
[J] ツリー構造を表現するマークアップ - Jamz (Design)
サイトのナビゲーションをリスト li タグでマークアップすることがありますが、似たような用途でツリー構造を表現した実装例を紹介してみようと思います。 マークアップの視点で解説された例 (e.g. li + css + javascript で実装 etc) は多数見つかると思いますが、プログラマ寄りな視点で見た場合の実装例を、本エントリーでは紹介してみようと思います。マークアップの視点、デザインの視点、プログラムの視点、色々な角度で見れるようになると良いと思います。 ディレクトリ構造 いわゆる Windows のエクスプローラー風に実装された例 Folder tree with Drag and Drop capabilities - A library of DHTML and Ajax scripts - DHTMLgoodies.com 左が実際に動いているもの、右が CSS
Aptana で関数名を補完するときに、関数の説明を表示 – JavaScript でコードアシスト
1. JavaScript で関数名を補完してほしい Aptana のような IDE を使っていた、一番助かる機能は、関数名を覚えておかなくて済むこと。 JavaScript や Ruby のような動的な型付けの言語を、シンプルなテキストエディタ一本でガシガシと書く人もいる。自分は、そんなことはとても無理。メジャーな関数名ですら、すぐに忘れてしまう。 (+_+) IDE から入った世代なので、IDE のサポートなしではコードを書けない。 Aptana で関数名を補完してくれる機能を、コードアシストと呼ぶ。 Aptanaの使い方解説 によると、 コードアシスト機能によって、コードの入力中にポップアップウインドウが表示され、入力を補完してくれます。… コードアシストで自分のコードを利用するには、AptanaのScriptDocツールに記録される必要があります。 2. 自分で定義した関数もコード
Aptana Studio 2.0 日本語化 - でぃんぶら日記
Aptana しばらくHTMLやらJavaScriptやらPHPなんかはサクラエディタで書いてたんだが、やっぱりAptanaを使っていこうと思ったらいつの間にかバージョンが2.0にまで上がっていた。Eclipse系はバージョン違いで日本語化に苦戦した記憶があったのだけど、やってみたら3分くらいで無事終わった。とりあえずメモ(するまでもないけど)。ちなみにVSで全部書いてる人っているのかなぁ。Aptana Studio 2.0 ダウンロードhttp://www.aptana.org/Pleiades ダウンロードhttp://mergedoc.sourceforge.jp/バージョン1.3.1 pleiades_1.3.1.zip日本語化作業pleiades_1.3.1.zipを解凍。pluginsフォルダに入ってる"jp.sourceforge.mergedoc.pleiades"を"C:
続・先取り！ Google Chrome Extensions 記事一覧 | gihyo.jp
運営元のロゴ Copyright © 2007-2024 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
Google Apps ScriptでスプレッドシートからGoogleドキュメント以外のサービスにアクセスする
はじめに Google Apps Scriptでは、GoogleドキュメントのみならずGoogleコンタクトやGoogleカレンダーなど多くのサービスにアクセスすることができます。それらをGoogleスプレッドシートから利用してみましょう。 対象読者 Web版オフィスアプリケーションの導入を考えている方。 GoogleドキュメントまたはGoogle Appsを既に使っている人。 各種のWebサービスの自動化を考えている人。 スクリプトを関数として使う 前回、Google Apps Scriptの基本操作と、スプレッドシートの基本的な扱いについて説明をしました。今回は、スクリプトの利用についてさらに深く考えてみましょう。まずは、「スクリプトを関数としてセルに設定する」ということからです。 Google Apps Scriptは、関数としてスクリプトを定義しますが、この関数は、Googleスプ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
leandrovieira.com – Só mais um site WordPress
typecs.com at Directnic