Fancybox не работает с определенным селектором

Эта

$(document).ready(function () {
    $('#welcomePopup').fancybox();              
});

только привязывает селектор #welcomePopup к fancybox, но он его не открывает. Вам все равно нужно click на этот селектор, чтобы открыть fancybox.

Нормальный сценарий для приведенного выше кода

<a id="welcomePopup" href="{your target content}">open fancybox</a>

где #welcomePopup - триггер fancybox

С другой стороны, если содержимое #welcomePopup - это то, что вы хотите показать как контент #welcomePopup (#welcomePopup - цель fancybox), тогда вам нужен другой селектор, который будет действовать как триггер.

Обычным подходом для этого второго сценария было бы:

HTML

<a class="fancybox" href="#welcomePopup">open welcome pop up in fancybox</a>
<div style="display: none;" id="welcomePopup">
    <h1>fancybox content</h1>
    <p>lorem ipsum</p>
</div>

JQuery

$(document).ready(function () {
    $('.fancybox').fancybox();              
});

Наконец, если вы хотите открыть fancybox без триггера и на загрузке страницы, то любой из них сделает трюк

$.fancybox({
    'padding': 5,
    'width': 625,
    'height': 450,
    'href': "#welcomePopup"
});

или

$.fancybox("#welcomePopup",{
    'padding': 5,
    'width': 625,
    'height': 450
});