2013-05-09 89 views
1

我很确定我彻底搜索了类似的事件...希望我没有忽视它,如果我这样做,我表示歉意。jQuery Colorbox在其他页面上工作,但不能在我的index.html上工作

我对我的直播现场安装此: www.sigmarating.com

现在,你可以在www.sigmarating.com/index2.html看到,例1颜色框工作完美无缺。现在,当我去实现index.html中的SAME标头脚本和样式表链接时...单击链接时没有任何反应。

的index.html:

<head> 
    <meta charset="utf-8"> 
    <title>Sigma Rating TM</title> 
    <meta name="description" content=""> 
    <meta name="author" content=""> 
    <!-- +++ Mobile Specific Metas +++ --> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
    <!-- +++ Load all the CSS Files with styles.css +++ --> 
    <link rel="stylesheet" href="styles.css"> 
    <link href='http://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic' rel='stylesheet' type='text/css'> 
    <!--[if lt IE 9]> 
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]--> 
    <!-- +++ Load Favicon Favicons +++ --> 
    <link rel="shortcut icon" href="favicon.ico"> 
    <!--COlorbox header!--> 
    <link rel="stylesheet" href="colorbox.css" rel='stylesheet' type='text/css'/> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" rel='javacsript' type='text/js'></script> 
    <script src="http://www.sigmarating.com/jquery.colorbox-min.js" rel='javascript' type='text/js'></script> 
    <script> 
     $(document).ready(function(){ 
      //Examples of how to assign the Colorbox event to elements 
      $(".group1").colorbox({rel:'group1'}); 
      $(".group2").colorbox({rel:'group2', transition:"fade"}); 
      $(".group3").colorbox({rel:'group3', transition:"none", width:"75%", height:"75%"}); 
      $(".group4").colorbox({rel:'group4', slideshow:true}); 
      $(".ajax").colorbox(); 
      $(".youtube").colorbox({iframe:true, innerWidth:425, innerHeight:344}); 
      $(".vimeo").colorbox({iframe:true, innerWidth:500, innerHeight:409}); 
      $(".iframe").colorbox({iframe:true, width:"80%", height:"80%"}); 
      $(".inline").colorbox({inline:true, width:"50%"}); 
      $(".callbacks").colorbox({ 
       onOpen:function(){ alert('onOpen: colorbox is about to open'); }, 
       onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); }, 
       onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); }, 
       onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); }, 
       onClosed:function(){ alert('onClosed: colorbox has completely closed'); } 
      }); 

      $('.non-retina').colorbox({rel:'group5', transition:'none'}) 
      $('.retina').colorbox({rel:'group5', transition:'none', retinaImage:true, retinaUrl:true}); 

      //Example of preserving a JavaScript event for inline calls. 
      $("#click").click(function(){ 
       $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here."); 
       return false; 
      }); 
     }); 
    </script>    

HTML外页彩盒我尝试拨打:

<p><a class='iframe' href="http://www.sigmarating.com/SIRcalculator/SIR.html">SIR Calculator</a></p> 

进出口使用的理发店响应布局 - ThemeForest如果有人是大家耳熟能详用它。我没有使用wordpress或drupal或任何其他CMS只是一个简单的切换和干响应的主题。

任何建议,将不胜感激!

- 谢谢!

回答

0

嗯,这是一个简单的完全覆盖我的头。我使用的主题在页面末尾加载了JavaScript,以加快加载时间。我想我从来没有打扰过往那里看,因为我已经在头文件中加载了另一个脚本,并且该脚本工作正常。但是,ColorBox jQuery插件需要与其他脚本一起加载。

感谢主题支持团队帮助我澄清我的愚蠢。

   <script src="assets/js/jquery-1.9.1.min.js"></script> 
       <script src="assets/js/jquery.validate.js"></script> 
       <script src="assets/js/jquery.bxslider.js"></script> 
       <script src="assets/js/smooth-scroll.js"></script> 
       <script src="assets/js/filter-gallery.js"></script> 
       <script src="assets/js/jquery.easing.1.3.js"></script> 
       <script src="assets/js/jquery.prettyPhoto.js"></script> 
       <!-- Initiate JQuery --> 
       <script src="assets/js/js.js"></script> 
       <script src="assets/js/jquery.colorbox-min.js"></script> 

这就是脚本如何结束了寻找到底,其中呼叫功能被置于“资产/ JS/js.js”内。

相关问题