JavaScript

フレキシブルなフルスクリーンのテキストエリアを実装できるjQueryプラグイン「jQuery Fullscreen Editor」

jQuery Fullscreen EditorというjQueryプラグインを使えば、簡単にテキストエリアにフレキシブルなフルスクリーンモードを実装することができます。画面いっぱいにテキストエリアが広がるので集中して文字を書くことができますね。

[ads_center]

jQuery Fullscreen Editorの使い方

jQuery Fullscreen Editor

jQuery Fullscreen Editor

こんな感じで、フルスクリーンモードのテキストエリアを実装できます。便利ですね。

使い方は、まずCSSファイルを読み込みます。

<link rel="stylesheet" href="fseditor.css" type="text/css" media="all">

続いて、jQuery本体とプラグインを読み込んでjQuery Fullscreen Editorをセットします。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="jquery.fseditor.min.js"></script>
<script>
  $(".mytextarea").fseditor();
</script>

使い方もシンプルで使いやすいですね。

オプションでは、overlay、placeholder、transition、maxWidth、maxHeightなど細かい設計調整が可能です。他にも色々な項目が用意されているので、詳しくは公式サイトで確認することができます。

Photoshopのブラシのサイズと硬さを変更するショートカットキーPhotoshopのブラシのサイズ(直径)と硬さを変更するショートカットキー前のページ

HTML5・CSS3・jQueryで作るレスポンシブなスライダーを実装できるjQueryプラグイン「Slippry」次のページ

関連記事

  1. baffle.js

    JavaScript

    DOM要素内のテキストを難読化させて読めるようにする「baffle.js」

    baffle.jsは、DOM要素内のテキストを暗号化して難読化させ、さ…

  2. Naver

    JavaScript

    シンプルですごくいい!レスポンシブに合うナビゲーションのjQueryプラグイン「Naver」

    NaverというjQueryプラグインがすごくシンプルでよかったのでご…

  3. imagelightbox

    JavaScript

    レスポンシブ対応でタッチフレンドリーな画像ギャラリー「imagelightbox」

    imagelightboxは、レスポンシブに対応したタッチフレンドリー…

  4. HTML5 Sortable

    JavaScript

    リストをドラッグ&ドロップで並べ替えることができるjQueryプラグイン「HTML5 So…

    リスト化した要素をドラッグ&ドロップで並べ替えることができるjQuer…

  5. MenuSpy

    JavaScript

    セクションビュー対応のナビゲーションメニュー実装「MenuSpy」

    MenuSpyは、ナビゲーションメニューを作成するためのjsライブラリ…

  6. TabbedContent

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. 桜と太陽
  2. ベルボン Mシリーズ
  3. ネック冷却ファン NRF10
  4. Kindle 8GBモデル
  5. プロテクティングクロス PC-E2

アーカイブ

PAGE TOP