Question

How to show and hide one particular column in Mouse Over and Mouse out receptively.
on mouse over i want to show column in a single row and on mouse out i want to hide the column in that particular row.

any answer will help me

thanks in advance.

Answer 1

Use something like $(".TableRowClass").mouseOver(function(){ $("#colName").addClass("show")});

And to hide simply use mouseOut and removeClass("show");

This is of course untested but if you need specific code then let me know and I’ll post code.

Edit

I should mention that the code is in jQuery.

Edit 2

The below works just fine. Some tweaking required.

   $(".hideShowSample").mouseover(function() {
        $(".hideShowSample #colToHide").removeClass("hideColumn");
    });
    $(".hideShowSample").mouseout(function() {
        $(".hideShowSample #colToHide").addClass("hideColumn");
    });
<style>
    .hideShowSample {}
    .hideColumn { display:none; }
</style>

<table>
    <tr class="hideShowSample">
        <td>$100.00</td>
        <td>Cheap stuff to buy.</td>
        <td id="colToHide" class="hideColumn">Backordered</td>
    </tr>
</table>