About

Focus plugin displays a visual effect whenever user sets focus into the text area.

Examples

Options

Focus plugin only has one option and that is its HTML template. It could be changed when passed to the $().textext() function. For example:

$('textarea').textext({
    plugins: 'focus',
    html: {
        focus: "<span/>"
    }
})

html.focus ('<div class="text-focus"/>')

HTML source that is used to generate markup required for the focus effect.

Events

Focus plugin dispatches or reacts to the following events.

blur

Focus plugin reacts to the blur event and hides the effect.

focus

Focus plugin reacts to the focus event and shows the markup generated from the html.focus option.

Methods

TextExtFocus.getFocus()

Returns focus effect HTML element.

TextExtFocus.init(core)

  • core {TextExt} Instance of the TextExt core class.

Initialization method called by the core during plugin instantiation.

TextExtFocus.onBlur(e)

  • e {Object} jQuery event.

Reacts to the blur event and hides the focus effect with a slight delay which allows quick refocusing without effect blinking in and out.

TextExtFocus.onFocus

  • e {Object} jQuery event.

Reacts to the focus event and shows the focus effect.

Fork me on GitHub