Advanced Search

Results 1 to 4 of 4

Thread: Concatenation failure in IE!

  1. #1
    Join Date
    Mar 2007
    Location
    New York, NY
    Posts
    557
    Thanks
    8
    Thanked 66 Times in 66 Posts

    Default Concatenation failure in IE!

    Works fine in Firefox, Chrome, Opera and Safari. However, in IE, I get the warning "Invalid argument" for these two lines.

    Code:
        elem.style.left = (xval + 'px');
        elem.style.top = (yval + 'px');
    Am I not allowed to concatenate an integer with a string in IE? I've tried removing the parentheses, adding .toString() at the end. But nothing seems to work. Any help guys?
    Last edited by JShor; 09-25-2011 at 10:27 PM.
    - Josh

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,684
    Thanks
    43
    Thanked 3,128 Times in 3,094 Posts
    Blog Entries
    12

    Default

    Usually it's done:

    Code:
    elem.style.left = xval + 'px';
    And it should be fine with the parentheses. And yes it works in IE. So the problem is likely that in IE elem and/or xval are not as you expect them to be in at that point in the code.

    Like xval could be NaN, or elem could be 'null or not an object', or qualify for 'object has no such object or property'. Or something else. Perhaps the event that sets this all in motion hasn't been assigned in IE . . .

    For instance, this works fine in IE and others:

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    var xval = 100;
    function moveit(el){
    	el.style.position = 'relative';
    	el.style.left = xval + 'px';
    }
    </script>
    </head>
    <body>
    <div style="background-color:blue;width:20px;height:20px;" onclick="moveit(this);"></div>
    </body>
    </html>
    Are you getting any errors in the IE developer tools script console?

    To diagnose this further it would be a great help to have a link to a page that demonstrates the problem.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    JShor (09-25-2011)

  4. #3
    Join Date
    Mar 2007
    Location
    New York, NY
    Posts
    557
    Thanks
    8
    Thanked 66 Times in 66 Posts

    Default

    Ah, I've solved the problem. xval was actually containing window.innerWidth + 200, but in IE, window.innerWidth was returning as undefined, resulting in the whole equation becoming NaN. I ended up using the jQuery $(window).width() to solve my problem.

    Thanks for replying, John.
    - Josh

  5. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,684
    Thanks
    43
    Thanked 3,128 Times in 3,094 Posts
    Blog Entries
    12

    Default

    In standards mode the closest equivalent to window.innerWidth in IE is:

    Code:
    document.documentElement.clientWidth
    So prior to jQuery and other similar libraries we see a lot of stuff like:

    Code:
    var winwidth = window.innerWidth? window.innerWidth : document.documentElement.clientWidth;
    Which is a good way to do it as I believe IE 9 now supports window.innerWidth. Except that if there's a vertical scrollbar and you don't want its width included, at least in some browsers, document.documentElement.clientWidth is more accurate. And many (I'm pretty sure not all) other modern browsers support it.

    So it depends upon how pixel perfect you need it to be. In most cases 'in the neighborhood' is close enough. In those cases where it isn't, the calculations (if truly cross browser) can get pretty complex.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •