2011-08-23 96 views
3

我正在向我的网站添加一个lightbox脚本,这是因为我在我的网站开始时使用了本教程http://tutorialzine.com/2010/11/apple-style-splash-screen-jquery/中的代码,所以它在进入网站时加载了动画,但是`两个jQuery脚本冲突

$(document).ready(function(){ 

    // Calling our splashScreen plugin and 
    // passing an array with images to be shown 

    $('#promoIMG').splashScreen({ 
     textLayers : [ 
      'img/thinner.png', 
      'img/more_elegant.png', 
      'img/our_new.png' 
     ] 
    }); 
}); 

上面的代码抵消了什么,我从收藏夹脚本中使用这里找到:http://leandrovieira.com/projects/jquery/lightbox/#

如何获得两个一起工作?

我将它们添加到我的头,如下所示(这是WordPress的范围内):

<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('stylesheet_url'); ?>" /> 
<link rel="shortcut icon" href="<?php bloginfo('stylesheet_directory'); ?>/favicon.ico" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/Javascript/jquery.splashscreen.js"></script> 
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/Javascript/script.js"></script> 
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/Javascript/lightbox/js/jquery.lightbox-0.5.js"></script> 
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/Javascript/lightbox/css/jquery.lightbox-0.5.css" media="screen" /> 

    <script type="text/javascript"> 

    $(function() { 
     $('#sidebar-menu a').lightBox(); 
    }); 
    </script> 

任何建议都行!

回答

3

你应该添加一个回调到初始屏幕插件初始化完成后的灯箱。

回调应该在创建对象

$('#promoIMG').splashScreen({ 
    textLayers : [ 
     'img/thinner.png', 
     'img/more_elegant.png', 
     'img/our_new.png' 
    ], 
    finished: function(){ 
     console.log('callback 2'); 
     $('#sidebar-menu a').lightBox();     
    } 
}); 

编辑添加condole.log的,看看有什么时关闭spash

splashScreen.click(function(){ 
    console.log('click event'); 
    splashScreen.fadeOut('slow', function(){ 
     console.log('callback 1'); 
     if(settings.finished != null) settings.finished(); 
    });  
}); 

然后通过回调click事件被执行代码实际上达到了。

+0

什么都没有发生,我将第一个代码添加到第34 - 38行之间的splash.js文件中,但仍然没有任何内容,并将底部添加到我的script.js文件中?我错过了什么? – Beto

+0

然后你需要做一些调试。我更新了我的答案。 –

+0

我试过在上面运行你的代码,但我不擅长js/jquery,也不知道如何检查错误。在Chrome或Safari浏览器中输入: – Beto