Fancybox 2.0 не загружается - PullRequest
0 голосов
/ 13 февраля 2012

Я искал и работал, и я не могу заставить работать fancybox в этом коде.Я пересмотрел несколько раз, и я не понимаю, почему это не работает.Я использую Dreamweaver, и fancybox помечены ниже, и я не знаю, какой код отличается от кодов fancybox

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/GabLopezIT.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<link rel="shortcut icon" type="image/x-icon" href="../images/favicon.ico" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Gabriele Lopez</title>
<!-- InstanceEndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">


-->
</style>
<link href="../css/psr_site_layout.css" rel="stylesheet" type="text/css" />
<link href="../css/psr_site_layout_content.css" rel="stylesheet" type="text/css" />
<link href="../css/psr_site_layout_gallery.css" rel="stylesheet" type="text/css" />
<link href="../css/psr_site_submenu.css" rel="stylesheet" type="text/css" />
<!-- InstanceBeginEditable name="head" -->
<style type="text/css">

/*.video {
    width:200px;
    float:left;
    margin-left:50px;
}*/
</style>



<!-- InstanceEndEditable -->
<style type="text/css">
</style>
<style type="text/css">
body,td,th {
    color: #FFF;
}
a:link {
    color: #CCC;
    text-decoration: none;
}
a:visited {
    color: #CCC;
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
a:active {
    text-decoration: none;
}

#bio {
    margin-bottom:-20px;
}

#social {
    margin-top:5px;
    height: 25px;
    width: auto;
    float: right;

}

#lang {
    float:left;
    width:auto;
    margin-right:15px;

}
#twitter {
    float: right;
    width: 60px;
    height: 24px;
    vertical-align: bottom;
    margin-left: 17px;
    margin-right: 5px;
}
#google {
    float: right;
    width: 50px;
    height: 24px;
    vertical-align: bottom;
    margin-left: 17px;
    margin-right: 15px;
}


.fb-like {
    height: 25px;
    width: 85px;
    float: right;
    vertical-align: bottom;
    margin-left: 17px;
    margin-right: 5px;
    display:inline-table

}



</style>
<link href="../css/copyright.css" rel="stylesheet" type="text/css" />
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

</script>
<link href="../css/bottom.css" rel="stylesheet" type="text/css" />
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
</head>
<body bgcolor="#666666" background="../img/background001.jpg" onload="MM_preloadImages('../images/facebook2.png')">

<!-- FACEBOOK CODE-->

<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "http://connect.facebook.net/it_IT/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<!--END FACEBOOK CODE-->

<!--TWITTER CODE-->
<script>!function(d,s,id){
    var js,fjs=d.getElementsByTagName(s)[0];
    if(!d.getElementById(id)){
    js=d.createElement(s);js.id=id;
    js.src="//platform.twitter.com/widgets.js";
    fjs.parentNode.insertBefore(js,fjs);}
    }(document,"script","twitter-wjs");</script>

<!--END TWITTER CODE-->

<!--GOOGLE+ CODE-->
<script type="text/javascript">
  window.___gcfg = {lang: 'it'};

  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>
<!--END GOOGLE+ CODE-->


<div id="psr_site_layout">
<table id="Table_01" width="800" align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
        <td><a href="../index.html"><img src="../img/bannerweb.png" alt="" width="800" height="200" border="0" /></a></td>

</tr>
    <tr>
        <td colspan="5">
            <img src="../img/layout/PSR-website-(sliced-new)_03.png" width="800" height="8" alt="" /></td>
    </tr>
    <tr>
    <td colspan="5"><ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="#">HOME</a></li>
<li><a href="news_it.php">NEWS</a></li>
<li><a href="tour_it.php">TOUR</a></li>
<li><a href="#">FOTOS</a></li>
<li><a href="videos_it.php">VIDEOS</a></li>
<li><a href="#">ALBUMS</a></li>
<li><a href="bio_it.html">BIO</a></li>
</ul>
<div id="social">
<div id="lang"><img src="../img/EN-button.png" width="20" height="20" /></div>
<div id="google"><g:plusone size="medium"></g:plusone>
</div>  
<div id="twitter"><a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.gabrielelopez.com" data-text="Senti la musica di Gabriele Lopez" data-lang="it">Tweet</a></div>

<div class="fb-like" data-href="http://www.gabrielelopez.com" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false" data-font="trebuchet ms"></div>
</div>


</td>
</tr>
    <tr>
        <td colspan="5">
            <img src="../img/layout/PSR-website-(sliced-new)_15.jpg" width="800" height="6" alt="" /></td>
    </tr>
    <tr>
        <td colspan="5"><!-- InstanceBeginEditable name="Content1" -->

Сценарии Fancybox начинаются здесь

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="fancybox/source/jquery.fancybox.pack.js?v=2.0.4"></script>
<script type="text/javascript" src="fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-buttons.js?v=2.0.4"></script>
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-thumbs.js?v=2.0.4"></script>
<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.0.4" type="text/css" media="screen" />
<link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-buttons.css?v=2.0.4" type="text/css" media="screen" />
<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=2.0.4" type="text/css" media="screen" />

<script type="text/javascript">
$(document).ready(function() {
    $(".various").fancybox({
        maxWidth    : 800,
        maxHeight   : 600,
        fitToView   : false,
        width       : '70%',
        height      : '70%',
        autoSize    : false,
        closeClick  : false,
        openEffect  : 'none',
        closeEffect : 'none',

    });
});
</script>

<div id="psr_site_layout_content">

Содержимое Fancybox HTMLначинается здесь

<a class="various fancybox.iframe" href="http://www.youtube.com/embed/_DjiHFxPauw" title="Vorrei tanto dirtelo"><img src="../img/tvpianeta.png"></a><p>Vorrei tanto dirtelo</p>

<a class="various fancybox.iframe" href="http://www.youtube.com/embed/L9szn1QQfas?autoplay=1">Youtube (iframe)</a>

<div class="video"><a class="various fancybox.iframe" href="http://www.youtube.com/embed/_DjiHFxPauw" title="Vorrei tanto dirtelo"><img src="../img/tvvorrei.png"></a><p>Vorrei tanto dirtelo</p></div>

<div class="video"><a class="lavita fancybox.iframe" href="http://www.youtube.com/embed/_DjiHFxPauw" title="Vorrei tanto dirtelo"><img src="../img/tvvita.png"></a>
<p>La vita che vorrei</p></div>

<div class="video"><a class="lavita fancybox.iframe" href="http://www.youtube.com/embed/_DjiHFxPauw" title="Vorrei tanto dirtelo"><img src="../img/tvhistoria.png"></a><p>Historia de un perfecto idiota</p></div>

<div class="video"><a class="lavita fancybox.iframe" href="http://www.youtube.com/embed/_DjiHFxPauw" title="Vorrei tanto dirtelo"><img src="../img/tvteletaxi.png"></a><p>Vorrei tanto dirtelo</p></div>
</div>

        <!-- InstanceEndEditable --></td>
    </tr>
    <div id="bottom">
    <tr>
        <td colspan="5">
            <img src="../img/layout/PSR-website-(sliced-new)_17.jpg" width="800" height="5" alt="" /></td>
    </tr>
    <tr>
    <td colspan="6"><div id="psr_site_submenu"><a href="index.php">Home</a> | <a href="outboard_it.html">News</a> | <a href="discografia.html">Tour</a> | <a href="media.html">Fotos</a> | Videos | <a href="contatti_it.html">Dischi</a> | <a href="www.facebook.com/pages/Poli-Studio-Recording/73432760131">Bio</a> | Cambia al Inglese</div></td>
</tr>
    <tr>
    <td height="39" colspan="6" class="copyright">
&copy; 2012 <a href="http://www.orangeparkrecords.com">Orange Park Records srl.</a><br />
Tutti diritti riservati.
</td>
</tr>
</div>
</table>
</div>
<p>&nbsp;</p>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
<!-- InstanceEnd --></html>

1 Ответ

0 голосов
/ 13 февраля 2012

Я не вижу нигде в вашем коде, что вы включили jQuery или файлы fancybox css и js.

Убедитесь, что вы включили скрипт и таблицу стилей в свой документ (убедитесь, что css и jsфайлы на вашем сервере).Убедитесь, что вы также загрузили библиотеку jQuery.

Следуйте этому примеру и соответственно измените пути:

<!-- Add jQuery library -->
<script src="http://code.jquery.com/jquery-latest.js"></script>

<!-- Add fancyBox -->
<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.0.4" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.0.4"></script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...