[JS]画像を用意しなくていいから簡単！クリッカブルに対応した日本の都道府県の地図を表示するスクリプト -Japan Map
デモページ 2 Japan Mapの使い方 Step 1: 外部ファイル jquery.jsと当スクリプトを外部ファイルとして記述します。 <head> ... <script src="https://code.jquery.com/jquery-2.1.1.js"></script> <script src="jquery.japan-map.min.js"></script> </head> Step 2: HTML 日本地図を配置するdivをセットします。 <body> ... <div id="map-container"></div> ... </body> Step 3: JavaScript jQueryのセレクタで配置する場所を指定し、スクリプトを実行します。 <script> $(function(){ $("#map-container").japanMap({ on
[JS]スタイルシートではできないテーブルの繋がったセルをハイライトするスクリプト -Wholly
テーブルにマウスでホバーすると、そのセルがハイライトしたり、列や行がハイライトするのはスタイルシートで実装できますが、rowspan, colspanがあるテーブルではうまくいきません。 テーブルのrowspan, colspanのハイライトを実現するjQueryのプラグインを紹介します。 右：rowspan有り、colspan有り Whollyの使い方 Step 1: 外部ファイル jquery.jsと当スクリプトをhead内に外部ファイルとして記述します。 <head> ... <script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script src="js/jquery.wholly.js"></script> </head> Step 2: HTML テーブルは通常通りの実装で構いません。 特定のテーブルの
[JS]一味違ったアイデアでレスポンシブ対応のテーブルを実装するスクリプト -Responsive tables
サイズが変更されても、ハイライト表示はできます。 Responsive tablesの使い方 Step 1: スタイルシート スタイルシートをhead内に外部ファイルとして記述します。 <head> ... <link rel="stylesheet" href="css/rwd-table.min.css"> </head> Step 2: スクリプト スクリプトを</body>の上あたりに記述します。 <body> ... <script type="text/javascript" src="js/rwd-table.js"></script> <script> $(function() { $('.table-complex').responsiveTable({ adddisplayallbtn: true, addfocusbtn: true, fixednavbar: '#n
SyntaxHighlighter の MTML 用ブラシ
SyntaxHighlighter の MTML 用ブラシ Permalink URL http://www.magicvox.net/archive/2011/12052004/ Posted by ぴろり Posted at 2011/12/05 20:04 Trackbacks 関連記事 (0) Post Comment コメントできます Category Great message Photo by David J SyntaxHighlighter を導入して、ソースコードの表示が超カラフルになってウキウキな今日この頃なわけですが、残念なことに MTML (MovableType Markup Language) 用のブラシが無いんですよね。HTML のソースとして表示しれやればそれなりに見えるものの、HTML と MTML が混在したソースだと、本来の HTML タグと MTM
[CSS]さりげなく、美しくて分かりやすいテーブルにするCSS3のチュートリアル
IE6などの非サポートブラウザも配慮した、角丸、ゼブラ柄、ハイライトなど美しくて分かりやすいテーブルを実装するCSS3のチュートリアルを紹介します。 デモページ:Zebra stripes, footer 角丸、セルを交互にカラーリング 実装のポイント CSS3を使って美しく、そして機能するテーブルを実装するポイントです。 画像を使用しないで、角丸を実装。 余分なid, classは使用せず、更新が容易。 ※tableにclassを一つだけ ユーザフレンドリーで、読むことが簡単。 実装 HTML HTMLは非常にシンプルです。 classは、tableタグにのみ使用します。 <table class="bordered"> <thead> <tr> <th>#</th> <th>IMDB Top 10 Movies</th> <th>Year</th> </tr> </thead> <tr
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
