Forum Discussion

Anonymous's avatar
Anonymous
Not applicable
8 years ago
Solved

Power BI Embedded Stealing Focus

Hi,

 

I have embedded a Power BI report at the bottom of a web page. It was all good unitl recently when the Power BI embedded frame started stealing the focus.

 

I didn't have any issue before and it only started happening in the last few days.

 

My search for solution brought me to a page where funnily the problem is replicated. If you visit that page https://blogs.msdn.microsoft.com/charles_sterling/2017/02/07/power-bi-publish-to-web-iframe-stealing-focus/ you'll notice that the page auto scrolls to embedded Power BI report once the page load is complete.

 

Can any one please tell me why this might be happening and what I can do to resolve this.

 

 

Need Help
Show and Tell
  • Eric_Zhang's avatar
    Eric_Zhang
    8 years ago
    Anonymous wrote:

    Hi,

     

    I have embedded a Power BI report at the bottom of a web page. It was all good unitl recently when the Power BI embedded frame started stealing the focus.

     

    I didn't have any issue before and it only started happening in the last few days.

     

    My search for solution brought me to a page where funnily the problem is replicated. If you visit that page https://blogs.msdn.microsoft.com/charles_sterling/2017/02/07/power-bi-publish-to-web-iframe-stealing-focus/ you'll notice that the page auto scrolls to embedded Power BI report once the page load is complete.

     

    Can any one please tell me why this might be happening and what I can do to resolve this.

     

     

    Anonymous

    Based on my research, there's no elegant solution for preventing the stealing focus. You can try the workaround in that link or my workaround as below. I hide the iframe when loading the page and after 2 seconds(2 seconds usually is enough to bypass the iframe focus event phrase) let it show.

    <html>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> 

<script type="text/javascript">   

window.onload = function () { 

$("#embedIframe").hide();


<!-- put other line heres--> 


var delayMillis = 2000; //2 second

setTimeout(function() { 

$("#embedIframe").show();
   
}, delayMillis);
}
 
 
</script> 
<p> Good day</p>  
</br></br></br></br></br></br></br></br></br></br>
</br></br></br></br></br></br></br></br></br></br>
</br></br></br></br></br></br></br></br></br></br>
</br></br></br></br></br></br></br></br></br></br> 

<iframe id="embedIframe" width="800" height="600"   

src="https://app.powerbi.com/view?r=eyJrIjoiM2I0YWMxMTItYjdmMC00Y2EzLWFkODEtZDY0OTM5NDM5YWU1IiwidCI6IjA4YTBiODI0LTU2ZjktNDk4My1hYzhhLTNmZDM3M2Y2ODQ2NiIsImMiOjF9" frameborder="0" allowFullScreen="true"></iframe> 

</html>

4 Replies

  • Eric_Zhang's avatar
    Eric_Zhang
    Microsoft Employee
    8 years ago
    Anonymous wrote:

    Hi,

     

    I have embedded a Power BI report at the bottom of a web page. It was all good unitl recently when the Power BI embedded frame started stealing the focus.

     

    I didn't have any issue before and it only started happening in the last few days.

     

    My search for solution brought me to a page where funnily the problem is replicated. If you visit that page https://blogs.msdn.microsoft.com/charles_sterling/2017/02/07/power-bi-publish-to-web-iframe-stealing-focus/ you'll notice that the page auto scrolls to embedded Power BI report once the page load is complete.

     

    Can any one please tell me why this might be happening and what I can do to resolve this.

     

     

    Anonymous

    Based on my research, there's no elegant solution for preventing the stealing focus. You can try the workaround in that link or my workaround as below. I hide the iframe when loading the page and after 2 seconds(2 seconds usually is enough to bypass the iframe focus event phrase) let it show.

    <html>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> 

<script type="text/javascript">   

window.onload = function () { 

$("#embedIframe").hide();


<!-- put other line heres--> 


var delayMillis = 2000; //2 second

setTimeout(function() { 

$("#embedIframe").show();
   
}, delayMillis);
}
 
 
</script> 
<p> Good day</p>  
</br></br></br></br></br></br></br></br></br></br>
</br></br></br></br></br></br></br></br></br></br>
</br></br></br></br></br></br></br></br></br></br>
</br></br></br></br></br></br></br></br></br></br> 

<iframe id="embedIframe" width="800" height="600"   

src="https://app.powerbi.com/view?r=eyJrIjoiM2I0YWMxMTItYjdmMC00Y2EzLWFkODEtZDY0OTM5NDM5YWU1IiwidCI6IjA4YTBiODI0LTU2ZjktNDk4My1hYzhhLTNmZDM3M2Y2ODQ2NiIsImMiOjF9" frameborder="0" allowFullScreen="true"></iframe> 

</html>
    • Anonymous's avatar
      Anonymous
      Not applicable
      8 years ago

      Eric_Zhang Thanks for sharing the solution, works like charm. I'll share this with my web developers.

       

      We didn't have this problem until only a few days back. Any reason why this might be happening now and not earlier?

       

      Thanks again

    • Ganesan-Elroi's avatar
      Ganesan-Elroi
      New Member
      2 years ago

      This is one of the option. But anyone can get the url using view the page source. I just try your answer. I can get the power BI URL. Is there any other options?.