$(function () {
    if (!Modernizr.input.placeholder) {
        var body = $("body");
        $("input[placeholder]").each(function () {
            var input = $(this);
            var text = $(this).attr("placeholder");
            var placeholder = $('<div/>', { 'class': 'placeholder', text: text, css: { position: 'absolute', fontSize: input.css('font-size')} })
                        .appendTo(input.parent())
                        .data("input", input)
                        .position({ my: 'left top', at: 'left top', of: input, offset: '10' })
                        .click(function () { input.focus(); });
            $(this).data("placeholder", placeholder);
        }).focus(function () {
            $(this).data("placeholder").hide();
        }).blur(function () {
            var input = $(this);
            if (!input.val()) {
                input.data("placeholder").show();
            }
        });

        // Keep the placeholders in the correct place when window is resized.
        (function () {
            var id;
            $(window).resize(function () {
                // ignore repeated resize calls, by buffering 50ms.
                if (id) clearTimeout(id);
                id = setTimeout(function () {
                    $("div.placeholder").each(function () {
                        $(this).position({ my: 'left top', at: 'left top', of: $(this).data("input"), offset: '10' });
                    });
                }, 50);
            });
        })();
    }
});