ugrás a tartalomhoz

JQuery Accordion 2x beagyazva nem megy

elba · 2008. Már. 29. (Szo), 01.39
Hi,

Menut epitek es a kovetkezo problemaba szaladtam:
A kovetkezo JS-eket hasznalnam a menuhoz:
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.dimensions.js"></script>
<script type="text/javascript" src="js/accordion.js"></script>
<script type="text/javascript" src="js/prototype.lite.js"></script>
<script type="text/javascript" src="js/moo.fx.js"></script>
<script type="text/javascript" src="js/moo.fx.pack.js"></script>

http://www.elba00.ultraweb.hu alatt.

Ha megnezitek a 2 tab alatt a harmonika mukodik rendesen, azonba a 3. mar alatt nem.
A HTMLem a kovetkezo JSt tartalmazza:
  1. <script type="text/javascript">  
  2. function init(){  
  3.     var stretchers = document.getElementsByClassName('box');  
  4.     var toggles = document.getElementsByClassName('tab');  
  5.     var myAccordion = new fx.Accordion(  
  6.         toggles, stretchers, {opacity: false, height: true, duration: 600}  
  7.     );  
  8.     //hash functions  
  9.     var found = false;  
  10.     toggles.each(function(h3, i){  
  11.         var div = Element.find(h3, 'nextSibling');  
  12.             if (window.location.href.indexOf(h3.title) > 0) {  
  13.                 myAccordion.showThisHideOpen(div);  
  14.                 found = true;  
  15.             }  
  16.         });  
  17.         if (!found) myAccordion.showThisHideOpen(stretchers[0]);  
  18. }  
  19. jQuery().ready(function(){  
  20.         // simple accordion  
  21.         jQuery('#list1a').accordion();  
  22.         jQuery('#list1b').accordion({  
  23.             autoheight: false  
  24.         });  
  25.           
  26.         // bind to change event of select to control first and seconds accordion  
  27.         // similar to tab's plugin triggerTab(), without an extra method  
  28.         var accordions = jQuery('#list1a, #list1b, #list2, #list3, #navigation, #wizard');  
  29.           
  30.         jQuery('#switch select').change(function() {  
  31.             accordions.accordion("activate"this.selectedIndex-1 );  
  32.         });  
  33.         jQuery('#close').click(function() {  
  34.             accordions.accordion("activate", -1);  
  35.         });  
  36.         jQuery('#switch2').change(function() {  
  37.             accordions.accordion("activate"this.value);  
  38.         });  
  39.         jQuery('#enable').click(function() {  
  40.             accordions.accordion("enable");  
  41.         });  
  42.         jQuery('#disable').click(function() {  
  43.             accordions.accordion("disable");  
  44.         });  
  45.         jQuery('#remove').click(function() {  
  46.             accordions.accordion("destroy");  
  47.             wizardButtons.unbind("click");  
  48.         });  
  49.     });  
  50. </script>  
A HTML pedig igy szol a 2. es 3. tab alatt:
  1. <div class="box">  
  2. <div class="basic" style="float:left;"  id="list1a">  
  3.             <a>There is one obvious advantage:</a>  
  4.             <div>  
  5.                 <p>  
  6.                     You've seen it coming!<br/>  
  7.                     Buy now and get nothing for free!<br/>  
  8.                     Well, at least no free beer. Perhaps a bear,<br/>  
  9.                     if you can afford it.  
  10.                 </p>  
  11.             </div>  
  12.             <a>There is one obvious advantage:</a>  
  13.             <div>  
  14.                 <p>  
  15.                     You've seen it coming!<br/>  
  16.                     Buy now and get nothing for free!<br/>  
  17.                     Well, at least no free beer. Perhaps a bear,<br/>  
  18.                     if you can afford it.  
  19.                 </p>  
  20.             </div>  
  21.             <a>Now that you've got...</a>  
  22.             <div>  
  23.                 <p>  
  24.                     your bear, you have to admit it!<br/>  
  25.                     No, we aren't selling bears.  
  26.                 </p>  
  27.             </div>  
  28.             <a>Rent one bear, ...</a>  
  29.             <div>  
  30.                 <p>  
  31.                     get two for three beer.  
  32.                 </p>  
  33.                 <p>  
  34.                     And now, for something completely different.<br/>  
  35.                     And now, for something completely different.<br/>  
  36.                     And now, for something completely different.<br/>  
  37.                 </p>  
  38.             </div>  
  39.         </div>      
  40.         </div>  
  41.         <div class="box">  
  42.             <div class="basic" style="float:left;"  id="list1a">  
  43.             <a>There</a>  
  44.             <div>  
  45.                 <p>  
  46.                     You've seen it coming!<br/>  
  47.                     Buy now and get nothing for free!<br/>  
  48.                     Well, at least no free beer. Perhaps a bear,<br/>  
  49.                     if you can afford it.  
  50.                 </p>  
  51.             </div>  
  52.             <a>Obvious advantage:</a>  
  53.             <div>  
  54.                 <p>  
  55.                     You've seen it coming!<br/>  
  56.                     Buy now and get nothing for free!<br/>  
  57.                     Well, at least no free beer. Perhaps a bear,<br/>  
  58.                     if you can afford it.  
  59.                 </p>  
  60.             </div>  
  61.             <a>Now</a>  
  62.             <div>  
  63.                 <p>  
  64.                     your bear, you have to admit it!<br/>  
  65.                     No, we aren't selling bears.  
  66.                 </p>  
  67.             </div>  
  68.             <a>Rent one bear, ...</a>  
  69.             <div>  
  70.                 <p>  
  71.                     get two for three beer.  
  72.                 </p>  
  73.                 <p>  
  74.                     And now, for something completely different.<br/>  
  75.                 </p>  
  76.             </div>  
  77.         </div>      
  78.         </div>  
Latjatok, a masodik class box alatt is ua. van mint az elsonel...akkor miert nem mukodik?
Elkepzelheto, hogy valamelyik kulso js-ben kell a hiba forrasa utan nezni? Ha igen..valaki segitene?

Koszonom.
 
1

id

duplabe · 2008. Már. 29. (Szo), 14.30
mert mindkét listának ugyanaz az id-ja. azt id egyedi azonosításra való, ha két elemnek ugyanaz, megzavarja a dolgokat. a masodik listanak list1b-nek kell lennie, mert úgy adtad meg a javascriptben.
2

nem az a gond szerintem...

numen · 2008. Már. 29. (Szo), 15.07
a linkelt oldalon már más kód van, benne ezzel:
  1. <div class="basic2" style="float:left;  id="list1b"">  
rakd át a végéről az idézőjelet a jobbik helyre:D
3

koszonom

elba · 2008. Ápr. 6. (V), 00.41
nagyon egyszeru volt: list1a, list1b.
koszi