Question

Hi My code in content editor web part is something like below

But I am getting description for all hyperlinks even if i mouse over on first item. Please let me know how to change the code in such a way so that it only displays the discription of the item iam hovering on. Please let me know if i am not clear.

My code from XSL:

Thanks,

Answer 1

Make your markup look like this :

<div class="divTitleLink">
  <a>Your First link</a>
  <div class="divDescription">Your First Description</div>
</div>
<div class="divTitleLink">
  <a>Your Second link</a>
  <div class="divDescription">Your SecondDescription</div>
</div>
...

Then, in your javascript :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>          
<script type="text/javascript">                                         
  $(document).ready(function() {
    $('a').hover(
      function () {
        $(this).parent('div').find('.divDescription').show();
      }, 
      function () {
        $(this).parent('div').find('.divDescription').hide();
      }
   );
  }); 

If I guessed the markup wrong, then you can adjust it using the parent, find, children and siblings functions in jQuery.