The Cache: Technology Expert's Forum
 
*
Welcome, Guest. Please login or register. September 16, 2019, 11:29:17 PM

Login with username, password and session length


Pages: [1]
  Print  
Author Topic: yet another JS challenge  (Read 2160 times)
nutballs
Administrator
Lifer
*****
Offline Offline

Posts: 5627


Back in my day we had 9 planets


View Profile
« on: October 28, 2007, 09:17:01 PM »

This problem is only in IE. And no, forgetting IE is NOT an option.

I want to get the width of an element, specifically a DIV, into a variable in JS. but for now, just to alert.

simple right?

this code should do it right?
Code:
alert(document.getElementById("'.$GLOBALS['styleprefix'].'-flyoutdiv").offsetWidth);

you would think. but no. the problem comes from the fact that when the page first loads, the div I need to measure does not exist yet. It is created by JS after the page (or while the page) is loaded. The Div is also hidden, but it does have a specific width set by the style sheet. Though the style sheet also is written after the fact.

The code above is inside a function, that gets run onmouseover.

when I do, IE returns 0, FF returns the actual width.
it has something to do with the order of execution of JS and DOM building i think. Even if i put the width actually into the style element of the DIV, i still can't get anything but 0.

so, thoughts?
Logged

I could eat a bowl of Alphabet Soup and shit a better argument than that.
perkiset
Olde World Hacker
Administrator
Lifer
*****
Offline Offline

Posts: 10096



View Profile
« Reply #1 on: October 29, 2007, 07:45:12 AM »

yes... but I am running fast to a client will comment later /p
Logged

It is now believed, that after having lived in one compound with 3 wives and never leaving the house for 5 years, Bin Laden called the U.S. Navy Seals himself.
perkiset
Olde World Hacker
Administrator
Lifer
*****
Offline Offline

Posts: 10096



View Profile
« Reply #2 on: October 29, 2007, 10:58:28 AM »

In IE, the page has to be "cured" before JS can see any of the DIV elements - but if you're attempting to activate this onMouseOver then I assume that it is... what I mean is that the DIV must be in and visible and the DOM must be "all done" before you'll be able to access it. For example, if I want to get a global handle to a node on the DOM in IE, I have to SetTimeout() to get it about 100ms later - I can't get it when the page is loading.

Also, if you have either 2 divs with the same ID or you have a global javascript variable with the same name as the DIV you will have troubles in IE.

You should also try (node).style.width and (node).style.height - these talk to the STYLEd width rather than the physical width. Since I can't see the body of code here, this may be an issue - IE has some weird behaviors here.

Gotta run, still trying to look smart @a client's... hope one of these working in the mean time...

/p
Logged

It is now believed, that after having lived in one compound with 3 wives and never leaving the house for 5 years, Bin Laden called the U.S. Navy Seals himself.
nutballs
Administrator
Lifer
*****
Offline Offline

Posts: 5627


Back in my day we had 9 planets


View Profile
« Reply #3 on: October 29, 2007, 12:22:10 PM »

basically whats building the page is a PHP that spits out JS which Document.write out to the client.
on the client, the result is an image, that when rolled over, would switch a hidden div to visible, and position it, absolutely on the page which is calculated relative to the image. So think of a flyout.

what I am trying to do is compensate for edge issues when the div would appear off page because of the layout. Easy enough in FF.

The ID of the div I am trying to get the dimensions of only exists once.
The style.width comes back blank, not even 0 in both browsers.
Code:
alert(window.document.getElementById("flyoutdiv").style.width);

since the rollover image is loaded at the same time as the div, actually in the same string, there should be no issue of the div not existing yet.
Logged

I could eat a bowl of Alphabet Soup and shit a better argument than that.
Pages: [1]
  Print  
 
Jump to:  

Perkiset's Place Home   Best of The Cache   phpMyIDE: MySQL Stored Procedures, Functions & Triggers
Politics @ Perkiset's   Pinkhat's Perspective   
cache
mart
coder
programmers
ajax
php
javascript
Powered by MySQL Powered by PHP Powered by SMF 1.1.2 | SMF © 2006-2007, Simple Machines LLC
Seo4Smf v0.2 © Webmaster's Talks


Valid XHTML 1.0! Valid CSS!