在iframe中插入div元素 [英] Inserting a div element inside of an iframe

查看:313
本文介绍了在iframe中插入div元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试在iframe中插入一个div元素,我希望最终应用一个完美的滚动条。截至目前,我已经能够在div中插入iframe并将完美的滚动条应用于它。有什么想法?

I am trying to insert a div element inside of a iframe to which I would like to eventually apply a perfect scrollbar. As of now I have been able to insert the iframe inside div and apply perfect scrollbar to it. Any ideas?

我的代码如下:

<!DOCTYPE html>
<html>
  <head>
    <title>perfect-scrollbar</title>
    <link href="http://noraesae.github.io/perfect-scrollbar/bootstrap-combined.min.css" rel="stylesheet">
    <link href="http://noraesae.github.io/perfect-scrollbar/perfect-scrollbar.min.css" rel="stylesheet">

    <style>
      #Sidebar 
        {
          position:relative; 
          margin:0px auto; 
          padding:0px; 
          width: 230px; 
          height: 463px; 
          overflow: hidden;
        }
      #iframe
        {
          position: relative;  
        }

    </style>
  </head>
  <body>
        <div id='Sidebar'>   

        <iframe id="iframe" src="http://www.w3schools.com/" width= "230" height="700" scrolling="no" frameborder="0">

            </iframe>  
         </div> 
    <script src="http://noraesae.github.io/perfect-scrollbar/jquery.min.js"></script>
    <script src="http://noraesae.github.io/perfect-scrollbar/perfect-scrollbar.min.js"></script>
    <script src="http://noraesae.github.io/perfect-scrollbar/bootstrap.min.js"></script>

    <script>
      $(function() {
        Ps.initialize(document.getElementById('Sidebar'));
        $('#iframe')     
      .contents().find('body')
      .append('<div id="sidebar"> Left Admin Panel </div>')
      });
    </script>
  </body>
</html>

我试图在iframe中作为div插入的部分如下:

The part I am trying to insert as a div inside iframe is as follows:

<<ul class="sidebar-menu">

        <li class="header">MyOGI APPLICATIONS</li>

        <li class="treeview">

          <ul class="treeview-menu">

          </ul>
        </li>


        <li class="header">GLOBAL APPLICATIONS</li>

        <li class="treeview">
          <a href="#">

            <i class="fa fa-angle-left pull-right"></i>
          </a>
          <ul class="treeview-menu">

          </ul>
          <li class="treeview">

          </li>
          <li class="treeview">

          <ul class="treeview-menu">

          </ul>
            </li>

    </ul> 


推荐答案

$('#iframe')     
          .contents().find('body')
          .append('mynewcontent goes here');

这篇关于在iframe中插入div元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆