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. Liquid Slider

    JavaScript

    タブパネル式のレスポンシブなjQueryスライダー「Liquid Slider」

    ちょっと珍しそうなスライダーを見つけたのでご紹介します。タブパネルにも…

  2. JavaScript

    フォーム内にあるplaceholderの利便性を高めてくれるjQueryプラグイン「FlowupLa…

    フォームを入力する際にあると便利なのがplaceholderです。しか…

  3. desoSlide

    JavaScript

    サムネイル付きのナビが素敵なスライダーを実装できるjQueryプラグイン「desoSlide」

    desoSlideというjQueryプラグインを使えば、サムネイル付き…

  4. jquery.resizeend

    JavaScript

    ウィンドウをリサイズした時にイベント発生できる「jquery.resizeend」

    jquery.resizeendは、ブラウザのウィンドウをリサイズした…

  5. no-image

    JavaScript

    カードを入れ替えるような3Dアニメーションによるスライダー「stack-slider」

    stack-sliderはカードを入れ替えるような3Dアニメーションに…

  6. Image Gallery Threejs

コメント

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

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

最近の記事

  1. タリーズ ハムチーズ&サラダサンド
  2. クリニカのY字タイプのフロス
  3. 日和山公園の桜
  4. 成城石井 フレンチロースト
  5. COMOLI カシミアシルクニットパーカ

アーカイブ

PAGE TOP