Application menu not hiding when clicking on an iframe

4 posts, 0 answers
  1. Martin
    Martin avatar
    10 posts
    Member since:
    Nov 2009

    Posted 15 Oct 2014 Link to this post


    The site I am designing is has a RadRibbonBar across the top of the screen, with the bottom 80% of the screen taken up with an iframe that displays content based on ribbon bar interactions.  Unfortunately, I have found that the application menu will not hide if you click on the iframe, it will only hide if you click on the ribbon bar or on part of the parent frame.

    I imagine the solution to this is to add javascript to the iframe click event (if such a thing exists) and to programatically hide the application menu, however, I cannot see any client side functions to achieve this and before I start randomly hiding elements manually I thought I should ask if there is a standard way to do this.

    Also, I would be interested to know if anyone else has encountered this issue and if they have any better solutions.

    Thank you
  2. Martin
    Martin avatar
    10 posts
    Member since:
    Nov 2009

    Posted 15 Oct 2014 in reply to Martin Link to this post

    I apologise, I have posted this in the wrong forum and cannot see any way to delete the post.  If it could be moved to it would be appreciated.
  3. DevCraft R3 2016 release webinar banner
  4. Boyan Dimitrov
    Boyan Dimitrov avatar
    1728 posts

    Posted 20 Oct 2014 Link to this post


    First I would suggest subscribing for the body element (within the iframe) on click event  and hide the application context menu of the RadRibbonBar of the parent document. Indeed It is a bit tricky to access an object in the parent page from the iframe context. Thus I am attaching a sample that implements very similar scenario.

    Boyan Dimitrov

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

  5. Martin
    Martin avatar
    10 posts
    Member since:
    Nov 2009

    Posted 20 Oct 2014 in reply to Boyan Dimitrov Link to this post

    Thanks for the response.

    Ultimately I ended up using a jquery plugin called iframe tracker:

    It uses blur and mousemove events to provide click events on iframes.  Seems to do the trick. 

    Unfortunately with my scenario it some of the iframe contents were cross domain which would prevent the click event from propagating.
Back to Top