SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Addict
    Join Date
    Nov 2009
    Posts
    284
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Getting width of page in iframe

    Hi,

    I am trying to get the width of the page in an iframe (on the same domain) using the following:

    Code:
    document.getElementById('iframe').clientWidth
    but it seems not to be working. The iframe width is a constant but I want to get the page width based on whether there is a scrollbar or not. If there is not scrollbar, the code should give the fixed iframe width, if there is a scrollbar (which means the page content height is greater than iframe height), the code should give fixed iframe width minus 17 (scrollbar width).

    Any ideas how to do that?

    Thanks.

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,358
    Mentioned
    179 Post(s)
    Tagged
    9 Thread(s)
    Hi,

    Are you using jQuery?

    if so, you can just do this:

    Code JavaScript:
    console.log(window.parent.$("#iframeID").width());

    HTH

  3. #3
    SitePoint Addict
    Join Date
    Nov 2009
    Posts
    284
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    Hi,

    Are you using jQuery?

    if so, you can just do this:

    Code JavaScript:
    console.log(window.parent.$("#iframeID").width());

    HTH
    Doesn't that give the width of the iframe itself? I need the width of the page within the iframe. For example, the following code returns the window width and window width minus the scrollbar, I am trying to do the same for the iframe if possible.

    Code:
    alert(window.innerWidth+', '+document.body.clientWidth);
    By the way, how can I get that console log value and use it? Tried assigning it to a variable but didn't work.

  4. #4
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,358
    Mentioned
    179 Post(s)
    Tagged
    9 Thread(s)
    Quote Originally Posted by nayen View Post
    I need the width of the page within the iframe.
    Oh, sorry!
    Try this:

    Code JavaScript:
    $(document).ready(function() { 
      $('iframe').load(function() {
        console.log($("iframe").contents().width());	
      });
    });

    Quote Originally Posted by nayen View Post
    By the way, how can I get that console log value and use it? Tried assigning it to a variable but didn't work.
    It should do.
    You could do this:

    Code JavaScript:
    $(document).ready(function() { 
      $('iframe').load(function() {
        var w = $("iframe").contents().width();
        console.log(w);
      });
    });


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
  •