-1

I have a table which its outputting about 1k records.

since there are many records I have to click down to view them all, but when I do scroll down and I click on the name it shows the output at the same place on top.

How can I get it that it can show the text next to where I click in on the browser without scrolling up?

I made a http://jsfiddle.net/xhow5n44/ . I'm not sure if this is something that will be easier to make it happen with css or javascript.

<script language="JavaScript">
 $(document).ready(function() {
     $('a').click(function () {
         var StateName = $(this).attr("detail");
         $('#maintext').show();
         $('#output').html(StateName);
     });
 });
</script>

<table class="tablecolors">
      <thead><th scope="col">Name</th><th scope="col">Ext:</th><th scope="col">Title </th></thead>
        <tbody>
        <cfloop query="Corporate"  >
        <cfoutput>
        <tr>
        <td ><a  id="showdata"  detail="Cell:<cfif  #Corporate.emp_cell# eq ""> No Number<cfelse>#Corporate.emp_cell# </cfif> 
        <br/>test">
        #Corporate.emp_namefirst#       
        <td ><div align="center">#Corporate.emp_ext#</div></td>
        <td > <cfif #Corporate.title_id# is not 19>#Corporate.title_name#</cfif> </td>

        </tr>
        </cfoutput>
        </cfloop>

        </tbody>
</table>

    <h2 id="maintext" style="display: none;">Here We will Display </h2>
    <div id="output"></div>
Lumi Lu
  • 3,289
  • 1
  • 11
  • 21
jfishbow
  • 253
  • 1
  • 11

1 Answers1

0

See this following Stack Overflow Answer to get the mouse position. Once you have it, you can use it to position your text based on that values via CSS and jQuery.

$(elem)
  .css('left', value_x + 'px')
  .css('top', value_y + 'px');

Edit As noticed by Roko in the comments, the code above can be improved by using object notation like

$(elem).css({
  'top':  value_y,
  'left': value_x
});
Community
  • 1
  • 1
Felix
  • 541
  • 1
  • 4
  • 14
  • You probably mean .css()... Also use object notation, and also "px" is not needed cause it's px by default. – Roko C. Buljan Nov 10 '14 at 20:00
  • Yeah, sure i ment `.css()` and not `.style()`. I looked in some of my code and forgot that I used another framework there. – Felix Nov 10 '14 at 20:25