如何为Blogger生成实时预览链接

时间:2017-11-08 13:02:53

标签: jquery blogger

这是我的网站 - http://www.adityanarayansharma.com

我发现使用Jquery Live预览链接可以开发但不确定如何在博客中实现它。有人可以帮助我在我的博主中生成实时预览链接吗?感谢

1 个答案:

答案 0 :(得分:1)

这是工作示例。单击按钮以弹出窗口预览您的博客

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<!-- Button for show popup -->
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>


<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 class="modal-title">Preview</h4>
    </div>
    <div class="modal-body">
      <iframe src="adityanarayansharma.com/p/home.html"; style="width:100%; height: 500px"></iframe>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>

</div>