Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript JQuery's .hover() s troubling me.

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #168692
    Rohithzr
    Participant

    ok i have a code that should work fine, it’s purpose is to show the tools on a table row when it is hovered.

    This image shows the result of the function when hovering table tbody tr
    http://imgur.com/OU8epnJ

    jQuery(document).ready(function() {
            jQuery('.table-hidaction tbody tr').hover(function() {
                jQuery(this).find('.table-action-hide a').animate({opacity: 1});
            }, function() {
                jQuery(this).find('.table-action-hide a').animate({opacity: 0});
            });
    });
    

    but nothing is happening and now

    This image shows the result of the function when hovering table
    http://imgur.com/lqXEho6

    jQuery(document).ready(function() {
            jQuery('.table-hidaction').hover(function() {
                jQuery(this).find('.table-action-hide a').animate({opacity: 1});
            }, function() {
                jQuery(this).find('.table-action-hide a').animate({opacity: 0});
            });
    });
    

    is working
    what i am not understanding is that if .table-action-hide a can work properly then why cant .table-hidaction tbody tr and i know that my code is working and css is correct because it works when .table-hidaction is used.

    also a gist of my table’s interpretation by chrome

    Please give me some suggestion and show the light in this darkness. :)

    #168693
    Paulie_D
    Member

    A Codepen demo or two would be useful

    #168695
    Rohithzr
    Participant

    ok i’ll try but it is highly unlikely as i am using all sorts of js and css of a theme so for it to work the same on codepen will be difficult.

    #168696
    Rohithzr
    Participant

    i can give team viewer access if you are willing o take some time out to help me.

    #168708
    Alen
    Participant

    Just to clear up some confusion:

    When you hover over the whole table, tools should appear?
    When you hover over individual table row, it should do what? Change background color? In the code you provided, you’re just fading the tools on both actions.

    You could transition the background with CSS.
    http://codepen.io/alenabdula/pen/IviDj

    #168712
    Rohithzr
    Participant

    no what i want to achieve is to display the tools of only hovered row. like this

    See the Pen mDBsA by Rohit Hazra ( @Rohithzr) on CodePen.
    <script async src=”//codepen.io/assets/embed/ei.js”></script>

    but due to some reason it is not working on my datatable

Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.