ModSecurity - セキュリティリスクを軽減するWebアプリケーションファイアウォール MOONGIFT
これは要導入検討ですね。 Webアプリケーションをセキュアに開発するのは基本ですが、それでも人が作るものである以上バグを含んでしまうのは致し方ありません。そこで未知の不具合を含めて防衛するための手段を考えなければなりません。 その一つとして、さらに外部からのアタックに対して考えられる手段がWebアプリケーションファイアウォール、通称WAFです。各種Webサーバに組み込めるオープンソースのWAF、それがModSecurityです。 デモが用意されておりインジェクションを起こそうと試みることができます。 特徴 ModSecurityの特徴として、多彩なWebサーバに対応しているというのがあります。Apache/nginx/IISサーバに対してインストールが可能です。また、以下のような特徴があります。 HTTPトラフィックのロギング 通常、Webサーバのログではリクエストボディは保存されません。
Sticky Table Headers & Columns - ヘッダー、見出しを固定表示するHTMLテーブルライブラリ MOONGIFT
業務システムではテーブルがよく使われますが、大量のデータを表示するとカラムが見えなくなっていったりきたりする操作が発生します。それはユーザにとってストレスで改善要望を出されること請け合いな訳ですが、丁度自分たちのシステムにあったものを探すのは大変です。 さらに業務システムがスマートフォンからも使いたいなんて言われたらどうしたら良いでしょう。そこで紹介したいのがSticky Table Headers & Columns、横に長いテーブルにも対応したヘッダー追従テーブルライブラリです。 デモです。こういった感じのテーブルがあったとします。 スクロールしてもヘッダーがついてきて常に一番上に固定されます。 続いて左側のカラムも固定されるパターン。これも顧客名やIDを常に出しておくとデータの確認がしやすくなります。 幅が広いテーブルでも右側にスクロールできるので問題ありません。 Sticky Ta
Image Lightbox - レスポンシブ/タッチ操作対応のLightbox系画像ビューワー MOONGIFT
画像をクリックして拡大表示するライブラリとして有名なのはLightboxやColorboxです。どちらも便利なライブラリですが、主にデスクトップ向けというのが難点です。最近ではスマートフォンからのアクセスも多いので、レスポンシブな画像表示ライブラリが求められます。 今回紹介するImage Lightboxはまさにそのためのソフトウェアです。レスポンシブかつタッチ操作に対応した画像表示ライブラリとなっています。 表示例。画面中央に大きく表示されます。 基本的に画像以外の部分をクリックすると消えます。 背景を白くした場合。左右をクリックで別な画像に切り替わります。 ×ボタン付き。 キャプション付き。画面下に灰色の帯で表示されます。 ページネーション。ツアー表示などに使えそうですね。 これらの機能は組み合わせて利用できます。 続いてスマートフォンの場合。 浮かび上がり方が良いですね。 ×ボタン付
jQuery Panorama Viewer - jQuery製のパノラマ写真ビューワー
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました せっかく撮った写真、Webブラウザで楽しみましょう！ iPhoneではパノラマ写真が撮影できるようになって、広範囲を映し出した写真が手軽に撮れるようになりました。しかしパノラマ写真は画像としてみれば単に横幅が広い写真でしかありません。むしろ写真としては見づらいでしょう。 そこで必要になるのは専用のビューワーです。今回はjQueryで作られた、WebベースのパノラマビューワーjQuery Panorama Viewerを紹介します。 jQuery Panorama Viewerの使い方 デモの写真です。マウスでドラッグして左右に移動できます。 実際に動作させているデモです。公式サイトで試用もできます。 iPhoneでパノラマ写真を撮るのは慣れるまで難しいですが、できあがった写真は迫力
jQuery.dotdotdot·溢れるテキストの末尾処理はこれで！ MOONGIFT
システムでHTMLを出力する場合に良くあるのが想定よりも文字数が多くて溢れてしまうケースです。スタイルシートのオーバーフローで切り捨ててしまっても良いですが、突然文字が切れてしまうのは何となく違和感があります。 そこで用いるのが一定の文字数以上の場合、…で締めるというものですが、文字数と切れる場所が常にちょうど良いとは限りません（特に日本語、英語が混ざった場合）。そこで使ってみたいのがjQuery.dotdotdotです。 jQuery.dotdotdotは指定した行数で文字数を区切ってくれます。同様のライブラリとしてはtrunk8が知られています。 左側が溢れた場合。右側はjQuery.dotdotdotによる補正後です。 …だけでなく、Read moreのように文字を指定することもできます。 HTMLにも対応しており、マークアップが適切に反映されています。単純にちょん切る訳ではありませ
MixItUp - リストやブロックを格好よくソート、フィルタリング MOONGIFT
情報のフィルタリングやカテゴライズ、並び替えをする際には都度URLを再読み込みして表示するのが一般的です。とは言えこれでは格好が悪いというケースもあるでしょう。 そこで使ってみて欲しいのがMixItUpです。パネルまたはリストの情報をフィルタリングします。その際のアニメーションがまた格好いいライブラリです。 MixItUpのデモ まずは動画でご覧ください。 ボタンを押した時のアニメーションが格好よく、洗練されています。 最初の表示です。全ての情報がランダムに並んでいます。 並び替え。数字ごとに並んでいます。 フィルタリング。青のラベルだけになっています。 表示方法としては四角いブロックの他、リストもできます。 MixItUpの使い方 まずはHTMLを次のように記述します。 <div id="Container"> <div class="mix category-1" data-myord
morris.js - SVGで手軽に綺麗なグラフを描くJavaScriptライブラリ MOONGIFT
管理画面などに格好いいグラフがあるとテンションがあがりますよね。とは言えグラフを表示するというのは意外と面倒で、ついつい後回しになってしまいがちです。 そこで手軽に格好いいグラフを描けるライブラリとしてmorris.jsを紹介します。 morris.jsの使い方 morris.jsはまずJavaScript/スタイルシートを読み込みます。 <link rel="stylesheet" href="http://cdn.oesmith.co.uk/morris-0.4.3.min.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-m
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
