hikaruworld / jquery.contenteditable.placeholder

contenteditable領域に対してplaceholderを実現するためのjQueryプラグイン

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

jquery.contenteditable.placeholder

contenteditable領域に対してplaceholderを実現するためのjQueryプラグインです。

Usage

CSS

[data-placeholder][data-placeholder-active=true]::before {
  content: attr(data-placeholder);
  opacity: 0.5
} 

javascript

一括指定したい場合

$(function() {
  $.setPlaceholder();
});

特定のID指定

$(function() {
  $.setPlaceholder("#test");
});

色々カスタマイズしたい場合

$(function() {
  $.setPlaceholder("#test", {inativeEvent: 'focus'});
});

Event

placeholder要素が更新された場合、デフォルト設定では、 Placehodlerが有効になった場合placeholderactiveが、 Placehodlerが無効になった場合'placeholderinactive'が発行されます。

TODO

  • CSS定義の独自カスタマイズ

About

contenteditable領域に対してplaceholderを実現するためのjQueryプラグイン

License:MIT License


Languages

Language:JavaScript 98.2%Language:CSS 1.8%