2012-07-27 176 views
0

我遇到了nivo滑块JQuery脚本的问题。我有幻灯片在这里没有布局的页面上工作:http://www.studentbridges.org/nivo-slider/slideshow.phpNivo Slider not Diplaying

但是,一旦我将它添加到我的布局,它不会显示。 http://www.studentbridges.org/new/

在该页面上,幻灯片应显示在标题中的图片上方。它只是不起作用。以下是我如何设置幻灯片的代码:

<head> 
    <link rel="stylesheet" href="/nivo-slider/themes/default/default.css" type="text/css" media="screen" /> 
    <link rel="stylesheet" href="/nivo-slider/nivo-slider.css" type="text/css" media="screen" /> 
</head> 

<div style="position: relative; left: 29px; top: 77px;"> 
<div style="position:absolute; width: 356px; height: 263px;" > 

     <div id="slider" class="nivoSlider"> 
      <img src="/nivo-slider/001.png" alt="" /> 
      <img src="/nivo-slider/002.png" alt="" /> 
      <img src="/nivo-slider/003.png" alt="" /> 
     </div> 
     <div id="htmlcaption" class="nivo-html-caption"> 
      <strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>. 
     </div> 


<script type="text/javascript" src="/nivo-slider/jquery-1.7.1.min.js"></script> 
<script type="text/javascript" src="/nivo-slider/jquery.nivo.slider.js"></script> 
<script type="text/javascript"> 
$(window).load(function() { 
$('#slider').nivoSlider({ 
    effect: 'fade', // Specify sets like: 'fold,fade,sliceDown' 
    animSpeed: 500, // Slide transition speed 
    pauseTime: 3000, // How long each slide will show 
    startSlide: 0, // Set starting Slide (0 index) 
    directionNav: true, // Next & Prev navigation 
    directionNavHide: true, // Only show on hover 
    controlNav: false, // 1,2,3... navigation 
    controlNavThumbs: false, // Use thumbnails for Control Nav 
    pauseOnHover: true, // Stop animation while hovering 
    manualAdvance: false, // Force manual transitions 
    prevText: 'Prev', // Prev directionNav text 
    nextText: 'Next', // Next directionNav text 
    randomStart: false, // Start on a random slide 
}); 
}); 
</script> 

</div> 
</div> 

我相信我的所有样式表都链接在我的标题中。所有图像的尺寸与容器DIV一样大,所以我不确定问题是什么。

任何人都有什么问题可以输入?

〜Noelle

回答

0

这个问题似乎是在你的PHP头文件。

头文件中的所有内容都被压缩为一行。这会导致您的JavaScript中出现错误,因为滑块配置中有注释。这些评论阻止了其他选项。

修复头文件的格式,一切都会好的。

+0

你知道会导致这个问题吗?由于文件本身(我正在上传到服务器)有换行符,所以我不确定是什么原因会导致所有内容都被压缩为一行... 我将尝试删除注释现在。也许这将有助于? – nellygrl 2012-07-27 20:37:14

+0

删除评论确实使幻灯片显示工作!但是,如果您对可能导致我的代码被压缩的任何意见(因为它可能会导致未来的问题),将不胜感激! – nellygrl 2012-07-27 20:40:28

+0

你需要提供一些代码。具体来说,您将包含头文件的行放入您的页面或模板中。 – Jrod 2012-07-29 14:55:06