0
At first I want to apologize for the typical beginner question. But I am a whole day trying to find in pixels the dimensions of certain element of my page but I can’t.
$(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>
<div id="webcam">
<video id="webcam-video" autoplay="true" preload="auto"></video>
<canvas class="drawingBuffer" />
</div>In Alert the height appears correctly, but the width always appears the value in %. What would be the correct way to do this through Jquery?
"always appears the value in %"... What do you mean? It doesn’t appear to me
%. What browser are you using?– Sergio
Can you use this jsFiddle and adapt to show the problem? https://jsfiddle.net/urvwh9gy/
– Sergio
In localhost always "width:100" appears and if I change the css to "width: 50%" Alert will display "width:50". I’m using Chrome and jsFiddle worked correctly (using the same browser I use to access localhost).
– Douglas D. Carvalho
And if you inspect the element with the Veloper tools that width gives?
– Sergio
div#webcam | 870 x 330
– Douglas D. Carvalho
Weird. It’s hard to know what’s going on if jsFiddle works well but not on your computer... What’s:
alert(window.getComputedStyle(document.getElementById('webcam')).width;?– Sergio
"100%" Can this be the jquery version? Currently I use version 2.2.0
– Douglas D. Carvalho
It is not possible to know the problem without having an example of the problem. Is the code you have in the question exactly the same as yours? If you can’t create a jsFiddle that plays the problem? Without that I’m sorry but we can’t help.
– Sergio
The code is exactly that of the question. Strangely in jsFiddle it works and locally it doesn’t. I will look for some way to solve the problem and if I find comment here. Anyway thanks for helping.
– Douglas D. Carvalho