CODEWITHSUNDEEP
javascriptjqueryhtml
milano
milano

Reputation: 475

How to find the actual width of element in javascript

Hi i am trying to find the actual width of given element and pop the alert which shows the actual width.

code i am using is here..

html element

<table cellspacing="1" cellpadding="5" style=";width:975px;border: 1px solid black;" id="menu_bar">

i am using this:

var widthofmenubar = $(this).find("#menu_bar").width;

Upvotes: 0

Views: 430

Answers (6)

user617263
user617263

Reputation: 5

there is two methods in jquery for width; 1) .innerWidth 2) .outerwidth

innerwidth calculate without margin width and outerWidth calculate with margin width.

$('#menu_bar').innerWidth();
$('#menu_bar').outerWidth();

Upvotes: 0

dev.meghraj
dev.meghraj

Reputation: 9110

$(this).find("#menu_bar").width(); for actual width that is displayed (rendered) and $(this).find("#menu_bar").css('width') for applied width

Upvotes: 0

Nono
Nono

Reputation: 7302

Try this:


First you edit your code, remove ';' after style attr

Correct Code is:

<table cellspacing="1" cellpadding="5" style="width:975px;border: 1px solid black;" id="menu_bar">

Not

<table cellspacing="1" cellpadding="5" style=";width:975px;border: 1px solid black;" id="menu_bar">

// Get Table Width by ID

var tableWidth = $('#menu_bar').css('width');

alert(tableWidth ); // will alert table width

Upvotes: 0

Dolo
Dolo

Reputation: 976

var widthofmenubar = $("#menu_bar").width();

Upvotes: 0

xdazz
xdazz

Reputation: 160833

Add the (), you need to execute the .width() method.

var widthofmenubar = $(this).find("#menu_bar").width();

Upvotes: 0

GautamD31
GautamD31

Reputation: 28763

Try like

var widthofmenubar = $("#menu_bar").width();

and edit your html like

<table cellspacing="1" cellpadding="5" style="width:975px;border: 1px solid black;" id="menu_bar">

Upvotes: 1

Related Questions