DD I use the function of expanding the text!

<script type="text/javascript"> $(document).ready(function(){ $(".btn-slide").click(function(){ $("#panel").slideToggle("slow"); }); }); </script>

The following is the Html code:

 <div id="panel"> Центральный процессор IBM System x3100 434832X<br> </div> <p class="slide"><a href="#" class="btn-slide">Подробнее...</a></p>

And even lower CSS (just in case)

 # panel { display: none; } .slide { margin: 0; padding: 0; } .btn-slide { text-align: right; padding-right:10px; margin: 0 auto; display: block; font-family:verdana, Helvetica, sans-serif; font-size:14px; color: #0387db; text-decoration: none; }

Everything works fine with one object! But when I duplicate and want another block to open too, I ask all the classes and id, it depresses the first block when pressed. When duplicating classes with a different name and additionally prescribing functions with the same classes, it starts working! Tell me how to make two units work from one function! Respectfully!

  • and where is the block with ID panel that unfolds? he is higher than the reference in the hierarchy ... but should just be embedded in it - Grimon

1 answer 1

Set or different id to all blocks or do <br>

 <script type="text/javascript"> $(document).ready(function(){ $(".btn-slide").click(function(){ $(this).find("#panel").slideToggle("slow"); }); }); </script> тогда уж вот так <p class="slide"><a href="#" class="btn-slide">Подробнее...</a> <div id="panel"> Центральный процессор IBM System x3100 434832X<br> </div> </p> <script type="text/javascript"> $(document).ready(function(){ $(".btn-slide").click(function(){ $(this).parent.find("#panel").slideToggle("slow"); }); }); </script>
  • thank! Only I did not understand where br? I do not want to constantly describe the function! - duddeniska 2011
  • javascript in only one place anywhere write at the beginning or end, and that's all - Grimon pm
  • 3
    thanks for the bread is not smeared)))) if everything is fine and the answer suits you, then click on accepting the answer - Grimon