jQuery Cycle Plugin - Contenu non vélo

Question

Je suis en train de créer une page avec le plugin Cycle de jQuery et ont quatre divs d'être relégué. J'ai le code en place, l'ensemble des images, mais il n'a pas le cycle correctement. Firefox dit qu'il ya un problème avec le code suivant:

<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
    fx: 'fade' 
  });
});
</script>

Voici le code html:

<div class="slideshow">
<div id="mainImg-1" class="slide">
  <div class="quote">
    <h2>Building Big Relationships with Small Business.</h2>
    <p>&ldquo;This is quote Number One.<br />
      They are there when I need them the most.&rdquo;</p>
    <p><span class="author">Jane Doe &ndash; Charlotte Flower Shop</span></p>
    <div class="help"><a href="cb_services.html">Let Us Help You</a></div>
  </div>
</div>

 <div id="mainImg-2" class="slide">
  <div class="quote">
    <h2>Building Big Relationships with Small Business.</h2>
    <p>&ldquo;This is quote Number Two.<br />
      They are there when I need them the most.&rdquo;</p>
    <p><span class="author">Jane Doe &ndash; Charlotte Flower Shop</span></p>
    <div class="help"><a href="cb_services.html">Let Us Help You</a></div>
  </div>
</div>

 <div id="mainImg-3" class="slide">
  <div class="quote">
    <h2>Building Big Relationships with Small Business.</h2>
    <p>&ldquo;This is quote Number three.<br />
      They are there when I need them the most.&rdquo;</p>
    <p><span class="author">Jane Doe &ndash; Charlotte Flower Shop</span></p>
    <div class="help"><a href="cb_services.html">Let Us Help You</a></div>
  </div>
</div>

 <div id="mainImg-4" class="slide">
  <div class="quote">
    <h2>Building Big Relationships with Small Business.</h2>
    <p>&ldquo;This is quote Number Fout.<br />
      They are there when I need them the most.&rdquo;</p>
    <p><span class="author">Jane Doe &ndash; Charlotte Flower Shop</span></p>
    <div class="help"><a href="cb_services.html">Let Us Help You</a></div>
  </div>
</div>

Voici le CSS:

.slideshow  { width: 946px; height: 283px; border: 1px solid #c29c5d; margin: 8px; overflow: hidden;  z-index: 1; } 

 #mainImg-1     { width: 946px; height: 283px;  background: url(../_images/main.jpg) no-repeat 9px 9px; }
 #mainImg-2     { width: 946px; height: 283px;  background: url(../_images/main.jpg) no-repeat 9px 9px; }
 #mainImg-3     { width: 946px; height: 283px;  background: url(../_images/main.jpg) no-repeat 9px 9px; }
 #mainImg-4     { width: 946px; height: 283px;  background: url(../_images/main.jpg) no-repeat 9px 9px; }

 #mainImg-1 .quote,
 #mainImg-2 .quote,
 #mainImg-3 .quote,
 #mainImg-4 .quote { width: 608px; height: 168px; float: right; margin: 80px 11px 0 0; background: url(../_images/bg_quoteBox.png) repeat-x; }

Avant de partir et dire, « hey, ces images sont tous les mêmes ». Vous avez raison, les images sont tout de même en ce moment, mais le texte doit être bien et en rotation, il y a une légère différence là-bas. En outre, le fondu doit encore apparaître.

Quoi qu'il en soit, vous pouvez voir la page dev ici: http://173.201.163.213/projectpath /first_trust/index.html

J'apprécierait un peu d'aide pour obtenir ce vélo à travers comme il se doit.

Merci!

Answer 1

En regardant la source, vous manquez plusieurs balises </script>.

<script type="text/javascript" src="_scripts/navigation.js"></script> 
<script type="text/javascript">
<script type="text/javascript">
<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
        fx: 'fade' 
    });
});
</script>
<title>Charlotte Bank Mooresville Bank First Trust Bank</title>