验证提示组件

以前主要写移动端，验证提示不会放在文本框后面，屏幕比较小，PC端这种提示很不错

我觉得PC兼容性很多，使用jquery是很好的，所以这个组件基于jquery，来避免未知的错误

;
(function ($) {
    $.fn.poperror = function (options) {
        var defaults = {
            msg: "",
            delay: ''
        };
        var opts = $.extend(defaults, options);//extend后面的会覆盖前面的值
        var top = $(this).offset().top;
        var width = $(this).width();
        var left = $(this).offset().left + width + 8;
        var height = $(this).height();
        var popup = $('<div class="popup-error"></div>');
        popup.css({
            left: left + 'px',
            top: top + 'px',
            height: height + 'px',
            lineHeight: height + 'px'
        }).html('<i></i>' + opts.msg);
        $(this).after(popup);
        if (opts.delay) {
            popup.animate({opacity: 0}, opts.delay);
            setTimeout(function () {
                popup.remove()
            }, opts.delay)


        }
    }
})(jQuery)

代码不多，就几行代码

全部代码在https://github.com/ralcen/jquery/blob/master/test-popup.html

预览地址http://output.jsbin.com/nihoxozani