www.webdeveloper.com
Results 1 to 11 of 11

Thread: Opening frame issue in Chrome

  1. #1
    Join Date
    May 2012
    Posts
    7

    Opening frame issue in Chrome

    Hi all,

    I have a pretty standard page with a menu down the left and when you click a link, it populates the main body of the page using JavaScript to show the frame. This works fine in IE and FF but in Chrome instead of just changing the frame in the body, it just treats it as a standard link and my menu disappears.

    Some code snippets:

    The links in the menu:
    Code:
    <li><a class="back" href="examples/v3_5_0/addresshelper.html#simple" onclick="changeFrameURL(this.href);return false;">Simple</a></li>
    <li><a class="back" href="examples/v3_5_0/addresshelper.html#field_names" onclick="changeFrameURL(this.href);return false;">Field Names</a></li>
    <li><a class="back" href="examples/v3_5_0/addresshelper.html#field_id" onclick="changeFrameURL(this.href);return false;">Field Id</a></li>
    The JS:
    Code:
    function changeFrameURL(_1){
    	frames["contentIFrame"].location.href=_1;
    	frames["contentIFrame"].focus();
    }
    The frame:
    Code:
    <iframe id="contentIFrame" name="contentIFrame" src="about/" width="800px" height="800px" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="auto"></iframe>
    I've tried adding target="_parent" to the frame, different ways of accessing the frames[] (parents.frames for example) but still can't get it to display nicely in Chrome.

    Any help would be greatly appreciated, Scott.

  2. #2
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    Any console errors?
    Where used, return should be executed unconditionally and always as the last statement in the function.

    That's my signature, it's not part of the damn post!

  3. #3
    Join Date
    May 2012
    Posts
    7
    No not that lucky I am afraid.

  4. #4
    Join Date
    Nov 2010
    Posts
    1,036
    it must be something else, because the below works fine in Chrome 19. Have you tried with absolute urls?

    Code:
    <html>
    <head>
    </head>
    
    <body>
    <li><a class="back" href="http://www.webdeveloper.com" onclick="changeFrameURL(this.href);return false;">Simple</a></li>
    <li><a class="back" href="http://www.webdeveloper.com/forum/forumdisplay.php?f=1" onclick="changeFrameURL(this.href);return false;">Field Names</a></li>
    <li><a class="back" href="http://www.webdeveloper.com/forum/forumdisplay.php?f=3" onclick="changeFrameURL(this.href);return false;">Field Id</a></li>
    <iframe id="contentIFrame" name="contentIFrame" src="http://www.webdeveloper.com/forum/showthread.php?t=261043" width="800px" height="800px" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="auto"></iframe>
    <script>
    function changeFrameURL(_1){
    	frames["contentIFrame"].location.href=_1;
    	frames["contentIFrame"].focus();
    }</script>
    </body>
    </html>

  5. #5
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    Quote Originally Posted by scotthendo View Post
    No not that lucky I am afraid.
    Using your code and markup, I can't replicate the problem, locally or online.

    Are you sure there's nothing in the target files that might make them break-out of a frame?
    Where used, return should be executed unconditionally and always as the last statement in the function.

    That's my signature, it's not part of the damn post!

  6. #6
    Join Date
    May 2012
    Posts
    7
    Quote Originally Posted by Logic Ali View Post
    Using your code and markup, I can't replicate the problem, locally or online.

    Are you sure there's nothing in the target files that might make them break-out of a frame?
    Any suggestions as to what could make it break-out of a frame? This is my first time using frames and it's part of a legacy app that hasn't been touched in a few years.

  7. #7
    Join Date
    May 2012
    Posts
    7
    Quote Originally Posted by xelawho View Post
    it must be something else, because the below works fine in Chrome 19. Have you tried with absolute urls?
    Thanks for that, I have tried absolute urls and still no luck.

    Not sure if it helps but there is one more higher level of menus than I originally posted. At first there are 2 options, selecting one of these expands the menu, ie:

    Code:
    <li>
    <a href="examples/v3_5_0/addresshelper.html" onclick="expandCollapseDiv('div1');changeFrameURL(this.href);return false;">Div1 <span style="font-size: 8px;color: #938989;">@TAG@</span></a></li>
    <div class="example" id="div1" style="display:none;">
    <ul class="level4">
       ... original menu links posted live here
    </ul>
    </div>
    Function to display the expanded menu (just changes style.display)
    Code:
    function expandCollapseDiv(_2){
    
    	var _3=document.getElementById(_2).style.display;
    	if(_3=="none"){
    		document.getElementById(_2).style.display="block";
    	}else{
    		document.getElementById(_2).style.display="none";
    	}
    		return true;
    }
    I have noticed that the first time you expand the top level menu, the frame changes fine (changeFrameURL() gets run here). It's only after clicking one of the lower level menu options and jumping to a particular div, ie:
    Code:
    <li><a class="back" href="examples/v3_5_0/addresshelper.html#simple" onclick="changeFrameURL(this.href);return false;">Simple</a></li>
    that the frame breaks (above code from OP).

    My best guess is that something in the addresshelper.html is breaking the frame. What that is I have no idea.

  8. #8
    Join Date
    May 2012
    Posts
    7
    Just an update, I've ran just about all the HTML through W3schools validator fixed everything and still happening.

  9. #9
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    Quote Originally Posted by scotthendo View Post
    Any suggestions as to what could make it break-out of a frame? This is my first time using frames and it's part of a legacy app that hasn't been touched in a few years.
    Try pasting this into the address bar in Chrome while you're on the relevant page, then press Enter. :
    Code:
    javascript:void( document.getElementById( "contentIFrame" ).src="examples/v3_5_0/addresshelper.html#simple" )
    Note that javascript: will probably be stripped out and have to be re-typed manually.

    If you still lose the frame then it must be something in the target page, although I can't imagine anyone having installed a Chrome-specific frame breaker.
    Where used, return should be executed unconditionally and always as the last statement in the function.

    That's my signature, it's not part of the damn post!

  10. #10
    Join Date
    May 2012
    Posts
    7
    Hi, thanks for the reply.

    After entering
    Code:
    javascript:void( document.getElementById( "contentIFrame" ).src="examples/v3_5_0/addresshelper.html#simple" )
    It jumps to the correct div and everything looks fine. So I guess that means it's not something in the target frame causing the problem and that it can find the correct page no problems. Not really sure where this leaves me. I am running out of ideas as to what would be causing the problem.

  11. #11
    Join Date
    May 2012
    Posts
    7
    So I replaced
    Code:
    frames["contentIFrame"].location.href=_1;
    with
    Code:
    document.getElementById( "contentIFrame" ).src=_1;
    and it works! Thanks for the help!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles