How to capture the size of a div where the value was not set

Question

How to capture the size of a div where the value was not set

Navigation

#1 by (1 votes)

1

I have a div, which contains a text inside, when I mouse over it, another div, which is a small bar of height:3px , stops being display:none and stays display:block , until Oh calm, everything is working. However, I would like the width of this bar to be the same as the size of the div that I hovered over.

For example:

<div>PALAVRA</div>
<div class="barra" style="display:none"></div>

My Jquery is correct:

$( ".internaMenu:eq(0)" ).hover(function() {
$( this ).find('.internaMenuBarra').css({'display':'block','width':'85px'});
    },
function() {
$( this ).find('.internaMenuBarra').css('display','none');
    });

I set the size in Jquery just to take a test.

jquery div

asked by anonymous 18.06.2014 / 14:05

1 answer

Is it possible to create and remove .properties files from Android, by the application itself? How to use a constructor with two or more classes?

score 1 · Accepted Answer

You need to get the size of this and then move in .css()

Test like this:

$(".internaMenu:eq(0)").hover(function () { // também pode usar ".internaMenu:first"
    var $this = $(this);
    var largura = $this.width(); // ir buscar a largura do elemento com hover
    $this.find('.internaMenuBarra').css({
        'display': 'block',
        'width': largura + 'px'
    });
}, function () {
    $(this).find('.internaMenuBarra').css('display', 'none');
});

Note that in your code the elements are siblings, not descendants. If your sample code is correct then you should use $this.next()

Example: link