2013-09-19 4 views
-2

я не могу показаться, чтобы выяснить, почему это Div слайд-шоу скрипт не работает:я не могу понять, что я этот скрипт не работает

Сценарий:

jQuery(function($){ 
    $("#slideshow > div:gt(0)").hide(); 

    setInterval(function() { 
     $('#slideshow > div:first') 
     .fadeOut(1000) 
     .next() 
     .fadeIn(1000) 
     .end() 
     .appendTo('#slideshow'); 
    }, 3000); 
}) 

HTML, :

<div id="slideshow"> 
<div> 
<img src="http://farm6.static.flickr.com/5224/5658667829_2bb7d42a9c_m.jpg"> 
</div> 
<div> 
<img src="http://farm6.static.flickr.com/5230/5638093881_a791e4f819_m.jpg"> 
</div> 
<div> 
Pretty cool eh? This slide is proof the content can be anything. 
</div> 
</div> 

Вот ссылка на сайт: прекрасный человек http://www.pearsonaviation.com.au/new/

+2

Вы смотрели в консоли разработчика на всех? Вы можете найти что-то очень интересное! –

+0

выглядит хорошо ... http://jsfiddle.net/arunpjohny/LgmYm/1/ –

+0

@ArunPJohny Помогает, если вы сначала загружаете jQuery и не имеете других синтаксических ошибок;) – Phil

ответ

0

Look в

http://jsfiddle.net/6A5QD/

не забыли ;. Ваша цепочка методов ... «интересная».

добавить абсолютное CSS, так что вы не получите, что коробка «прыжок»

0

Проблема: -

Вы загружаете jquery.backstretch.min.js перед загрузкой jquery library в вашем site, которая вызывает ошибку на вашем сайте . Поскольку вы пытаетесь использовать jQuery object, который еще не определен.

проверка консоли

enter image description here

Решение

Загрузить JQuery файл библиотеки перед тем jquery.backstretch.min.js

Как это

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script src="http://www.pearsonaviation.com.au/new/modules/mod_backstretch/tmpl/js/jquery.backstretch.min.js" type="text/javascript"></script> 

код с проблемой

<script src="/new/media/system/js/mootools-core.js" type="text/javascript"></script> 
    <script src="/new/media/system/js/core.js" type="text/javascript"></script> 
    <script src="/new/media/system/js/caption.js" type="text/javascript"></script> 
    <!-- jquery.backstretch.min.js --> 
    <script src="http://www.pearsonaviation.com.au/new/modules/mod_backstretch/tmpl/js/jquery.backstretch.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
window.addEvent('load', function() { 
       new JCaption('img.caption'); 
      }); 
    </script> 
    <style> 
     .noImages{ 
     color:#000; 
     font-size:11px; 
     background:#F9EAAE; 
     border:1px dotted #ff0000; 
     padding:5px; 
     } 

     </style> 

<!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]--> 
<link rel="stylesheet" href="/new/templates/onlinespark/css/template.css" /> 


you are loading jQuery.min here 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script src="/new/templates/onlinespark/cufon-yui.js"></script> 
    <script src="/new/templates/onlinespark/HelveticaNeueLT_Com_65_Md_800.font.js"></script> 
Смежные вопросы