Problematic function call in Jquery

This works:

$("a.lightbox").click(function (e) {
    //var heading = $(this).attr('rel')
    // hide scrollbars!
    $('body').css('overflow-y', 'hidden')
    $('body').css('overflow-x', 'hidden');
    $('<div id="lightbox_overlay"></div>').appendTo('body');    
    return false;
});

But this doesn't

function showImage(){
    $('body').css('overflow-y', 'hidden')
    $('body').css('overflow-x', 'hidden');
    $('<div id="lightbox开发者_Python百科_overlay"></div>').appendTo('body');
}

$("a.lightbox").click(function (e) {
    showImage();
    return false;
});

Any help will be greatly appreciated

---

Does this work?

(function($) {

    function showImage() {

        $("body").css({

            "overflow-y" : "hidden",
            "overflow-x" : "hidden" 

        });

        $('<div id="lightbox_overlay"></div>').appendTo("body");

    }

    $("a.lightbox").click(function(e) {

        e.preventDefault();
        showImage();

    });

})(jQuery);