CODEWITHSUNDEEP
phpjquerycss
vish
vish

Reputation: 45

jquery is not work for every href element

  1. when first "read more" href click, div changed.first click it span and when second click it shrink.
  2. But it is not work for other href element

  3. how to solve this problem.please help me.

     <script>
     $(document).ready(function(){
         $('#more').click(function(){
            var toggleheight = $("#readmore").height() == 500 ? "100px" : "500px";
                  $('#readmore').animate({ height: toggleheight });
                  });
           });

     </script>

  4. here is the php code

         <?php
      mysql_query("SET NAMES 'utf8'");
      $set_news=mysql_query("SELECT solution_date,Category,solution FROM solution ORDER BY solution_date DESC LIMIT 10",$connection);
        if(!$set_news){
        die("database query failed".mysql_error()); 
                        }

                        for($i=1;$i<=10;$i++) {
                        $rowofnews=mysql_fetch_array($set_news);

                        $category=$rowofnews['Category'];
                        $solution=$rowofnews['solution'];

                        echo ('<li>');
                        echo ('<div id="readmore"');
                        echo('<h2>');
                        echo $category;
                        echo('</h2><p>');
                        echo $solution;
                        echo('</p></div>');
                        echo('<p><span><a href="#" class="more" id="more">Read More</a></span></p></li>');
                        }
        ?>

Upvotes: 0

Views: 56

Answers (2)

way2vin
way2vin

Reputation: 2551

ID's are unique, duplicate ID is not allowed refer http://css-tricks.com/the-difference-between-id-and-class/ for more details.

and try chnaging your script to

 <script>
   $(document).ready(function(){
      $('.more').on('click', function(){
         var toggleheight = $(".readmore").height() === 500 ? "100px" : "500px";
            $('.readmore').stop().animate({ height: toggleheight });
            });
       });
 </script>

jQuery.stop() stops currently-running animation.

Upvotes: 2

Richard Peck
Richard Peck

Reputation: 76774

If you're trying to select multiple elements, you shouldn't use ID's, you should select by class, like this:

$('.more').on("click", function(){

Upvotes: 0

Related Questions