Height of one div based on another div

Question

How to leave the div result777 the same size as the div publicidade?

<script>
    $( "#result777" ).load(function() {
        if ( $("#publicidade").height() == "390px"){
            var altura3 = $("#publicidade").height();
        }
        else
        {
            var altura3 = "390px";
        }
    });
</script>
<script>
    $( document ).ready(function() {
        $('#result777').slimScroll({
            position: 'right',
            color: '#748392',
            height: altura3,
            width: '310px',
            railVisible: true,
            alwaysVisible: false,
            railColor: '#fff',
        });
    });
</script>

Answer 1

Considering what you said in previous question, You seem to lack the concept of asynchronous operations for you to understand what is occurring. Whenever you make a request by ajax (for example, in $( "#result777" ).load…), the result only arrives later, and the following lines of the code execute immediately. So we pass a function (callback) in ajax calls, so that it is executed only when the result arrives.

Given that, you have two options:

1. Just start the slimScroll after the result of load arrive:

   $(document).ready(function() {
       $( "#result777" ).load(function() {
           $('#result777').slimScroll({
               position: 'right',
               color: '#748392',
               height: $("#publicidade").height(),
               width: '310px',
               railVisible: true,
               alwaysVisible: false,
               railColor: '#fff'
           });
       });
   });
   

2. Check if the slimScroll plugin offers any method to reset the height after its startup, as suggested in the comments below the Fulvius question and answer.

In addition, the if in his first block of code makes no sense. He tries to say: if the height of $("#publicidade") for 390, use 390, otherwise use 390. Well, if you’re gonna use it 390 ever, the if is unnecessary.

Answer 2

Save the value of the div #publicidade in a variable:

var tamanho = $('#publicidade').height();

Then assign this value to the div #result777 :

$('#result777').css('height' , tamanho);

Answer 3

What I did was put on the height of the slimScroll the $("#advertising"). height() ...

<script>
$(document).ready(function() {
    $('#result777').slimScroll({
        position: 'right',
        color: '#748392',
        height: $("#publicidade").height(),
        width: '310px',
        railVisible: true,
        alwaysVisible: false,
        railColor: '#fff',
    });
});
</script>

Take the tests and tell us if you’ve solved!

Answer 4

I already decided, I had to change the height by css, so oh:

$('.slimScrollDiv').css('height', '500px');

slimscroll uses this class and can change the height like this