jquery - ファンシーボックスオーバーレイ

Question

ファンシーボックスでオーバーレイを機能させるにはどうすればよいですか? 以下のコードを使用して、jquery をほとんどまたはまったく理解していません。ボックスが正常にポップアップしますが、バックグラウンドには何もありません。必要な単純なコードがどこかにあることは知っていますが、何らかの理由でそれを見つけることができないか、見落としています。助けていただければ幸いです。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery  /1.7/jquery.min.js"></script>

<link rel="stylesheet" href="css/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.fancybox.pack.js?v=2.0.5"></script>

<!-- fancyBox buttons -->
<link rel="stylesheet" href="css/jquery.fancybox-buttons.css?v=2.0.5" type="text/css" media="screen" />
<script type="text/javascript" src="../js/jquery.fancybox-buttons.js?v=2.0.5"></script>

<!-- fancyBox thumbnails -->
<link rel="stylesheet" href="css/jquery.fancybox-thumbs.css?v=2.0.5" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.fancybox-thumbs.js?v=2.0.5"></script>

<script type="text/javascript">

$(document).ready(function() {
     $(".vimeo").fancybox({
         width: 700,
         height: 393,
         type: 'i frame',
         'autoScale': false,
         'autoDimensions': false,
         'transitionIn' : 'fade',
         'transitionOut' : 'fade',
         'transitionIn' : 'elastic',
         'transitionOut' : 'elastic',
         'speedIn' : 600, 
         'speedOut' : 200, 
         'overlayColor' : '#E71313'
     });

     $("#various1").fancybox({
                               'title Position' : 'inside',
                               'transitionIn' : 'none',
                               'transitionOut' : 'none',
                               'transitionIn' : 'elastic',
                               'transitionOut' : 'elastic',
                               'speedIn' : 600, 
                               'speedOut' : 200,
                               'overlayColor' : '#E71313'
     });
});

</script>
</body>