StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POTrying to find the width of hidden content in order to resize the containing div to show the content (jQuery)
primarykey
Id
4754494
data
AcceptedAnswerId
4756642
AnswerCount
3
ClosedDate
CommentCount
2
CommunityOwnedDate
CreationDate
2011-01-21T01:15:29.043
FavoriteCount
2
LastActivityDate
2011-01-21T15:16:49.070
LastEditDate
LastEditorUserId
0
OwnerUserId
563296
ParentId
0
PostTypeId
1
Score
1
ViewCount
2055
LastEditorDisplayName
text
Body
I am trying to create a resizing container that will "grow" on $('element').hover, but I only want to do so when the content in the LI is to wide and hidden due to a css overlow:hidden. I can't seem to find a way to find the total widht of the hidden content. For example: <pre><code><ul id="innerContainer"> <li><a href="/Afrikaans/index.html">Afrikaans</a></li> <li><a href="/Arabic/index.html">Arabic</a></li> <li><a href="/Chinese/index.html">Chinese (Mandarin) What The Its Just Crazy</a></li> </ul> </code></pre> The li containing the Chinese (Mandarin)... is too wide to fit in the 172px wide container. I want to be able to find out the width on .hover() so I can resize the container to fit. I need it to be dynamic because the li that is too wide will not always conatin the same content. CSS is : <pre><code>#innerContainer {position:absolute; left:0; top:0; height:200px; overflow:hidden;} #scroller ul {margin:0; padding:0; list-style:none;width:172px;} #scroller ul li {float:left; height:27px; width:172px;} #scroller ul li a {overflow:hidden;display:block; float:left; height:26px; line-height:26px; width:172px; font-size:11px; color:#000; font-weight:bold; text-decoration:none; text-indent:5px; border-bottom:1px solid #000;} </code></pre> All i can get is the actual width which is 172px. Take into consideration that the items are already in a vertically scrollable container. An example of this in action is at <a href="http://www.pronunciator.com/Vietnamese/index.html" rel="nofollow">http://www.pronunciator.com/Vietnamese/index.html</a> You can see how the rows in the menu that are too wide overflow into the next line. I killed that by using overflow:hidden. Now i need to find the width of the line of hidden text. Thanks in advance for any replies.
Tags
<javascript><jquery><html><css>
Title
Trying to find the width of hidden content in order to resize the containing div to show the content (jQuery)
singulars
PostAcceptedAnswerId
1. PO
 singulars
 PostTypePostTypeId
 PTAnswer
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. This table or related slice is empty.
UserOwnerUserId
1. USJoshua Riddle
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. PL
 singulars
 LinkTypeLinkTypeId
 LTLinked
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. PO
 singulars
 PostTypePostTypeId
 PTAnswer
2. PO
 singulars
 PostTypePostTypeId
 PTAnswer
3. PO
 singulars
 PostTypePostTypeId
 PTAnswer
VotesPostIdCreationDate
CommentsPostId
1. CODid you put a <div> around the <ul> and then try and get the width from that?
 singulars
 PostPostId
 POTrying to find the width of hidden content in order to resize the containing div to show the content (jQuery)
 UserUserId
 USTheGeekYouNeed
2. COWhen i try this: $('ul#innerContainer li').hover(function(){ $('#test').html($(this).html() + ' : ' + $(this).eq(2).width()); },function(){ $('#test').html('OUT'); }); It returns null as the width. I use (this) so I can get the width of just the selected LI. Im returning the values to an empty div on the page with the id test.
 singulars
 PostPostId
 POTrying to find the width of hidden content in order to resize the containing div to show the content (jQuery)
 UserUserId
 USJoshua Riddle

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.