At first I want to apologize for the typical beginner question. But I'm all day trying to find in pixels the dimensions of a certain element of my page but I can not.
$(document).ready(function () {
$altura = $('#webcam').height();
$largura = $('#webcam').width();
alert('altura:' + $altura + ', largura:' + $largura);
});
#webcam {
width: 100%;
height: 60vh;
background-color: black;
}
/* line 6, ../sass/_viewport.scss */
#webcam canvas, video {
float: left;
height: 60vh;
width: 100%;
}
/* line 10, ../sass/_viewport.scss */
#webcam canvas.drawingBuffer, video.drawingBuffer{
margin-left: calc(100% * (-1));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="webcam">
<video id="webcam-video" autoplay="true" preload="auto"></video>
<canvas class="drawingBuffer" />
</div>
No alert height appears correctly, but width always shows value in%. What would be the correct way to do this through JQuery?