Showing qTip onmouseover

Question

I am trying to validate a form, using jQuery validate and show errors messages using qTip. But i want to show error message onMouse Over, as of now when i submit the form the error messages are coming next the text field.

How do i show the error message when i mouseover the textfield.

Demo - http://jsfiddle.net/UcaZT/

rvi.

Answer 1

The code showing the qtip tooltips looks like this:

// Apply the tooltip only if it isn't valid
$(element).filter(':not(.valid)').qtip({
    overwrite: false,
    content: error,
    position: position,
    show: {
        event: false,
        ready: true
    },
    hide: false,
    style: {
        classes: 'ui-tooltip-red' // Make it red... the classic error colour!
    }
});

This

show: {
    event: false,
    ready: true
},

tells qTip to open the tooltips immediately.

You want something like this:

    show: {
        event: 'mouseover'
    },
    hide: {
        event: 'mouseout'
    },

Here is an updated jsFiddle