<link href hyperlink

Question

我从整个编码开始(它很漂亮)，但我发现自己遇到了一个问题。

我找到了一个登录页面，我复制了一下，它有一个按钮，可以作为另一个页面的超链接，但我没有那个按钮，我有一个样式表的代码，它有点像人们必须填写的表单。所以你按下按钮，表单就会弹出来。

我有原始登录页面的代码，我也有表单的代码，但我不知道如何将它们混合，请帮助。

第一个是将用户带到https://myimstrategy.com/50perday-2/的原始按钮代码。我想用弹出的表单替换那个网站。这是底部的第二个代码，我不知道如何合并这两个代码。我附上了一个原始按钮的图像。我不想删除它，我只是想让表单在我点击它时弹出。

非常感谢您的帮助！

​

.el-content{
  display: inline-block;
  width: auto;
  height: auto;
  min-width: 894px;
  min-height: 114px;
}
.ib2-button {
  color: rgb(15, 15, 15);
  background-color: rgb(25, 202, 6); 
  border-color: rgb(0, 174, 0); 
  border-radius: 5px; 
  text-shadow: rgb(147, 138, 138) 1px 1px 0px; 
  background-image: none;
  min-width: 920px; 
  min-height: 123px; 
  width: auto; 
  height: auto; 
  font-weight: bold; 
  font-size: 80px;
}

<div class="el-content">
  <a href="https://myimstrategy.com/50perday-2/" class="ib2-button open-popup" target="_self">Claim Your Spot Now &gt;&gt;</a>
</div>
<link href="//app.webinarjam.net/assets/css/register_button.css" rel="stylesheet">

<div style="margin:auto;width:300px;">
  <div class="embedded-joinwebinar-button">
    <button type="button" class="btn btn-default css3button" title="regpopbox_35246_b21043f77c">
      <span>Register now</span>
    </button>
  </div>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js" language="javascript" type="text/javascript"></script>
<script src="//app.webinarjam.net/assets/js/porthole.min.js" language="javascript" type="text/javascript" async></script>
<script src="//app.webinarjam.net/register.evergreen.extra.js" language="javascript" type="text/javascript" async></script>

​

Answer 1

如果你想创建一个弹出窗口，你需要使用javascript。这通常被称为模式。这里有一个教程的链接：How TO - CSS/JS Modal

Answer 2

您可以使用bootstrap modal，或者添加onclick="showForm()"，然后将id="form"放入表单。然后在head标签中放入

<script>
function showForm(){
    document.getElementById("form").style.display = "inline-block"; //It must have display: none, the form, and this will make it display
}
</script>

Answer 3

我找不到你的图片，但我知道了，你想在点击按钮时显示一个弹出窗口。您只需提供一个href，如下所示：

<link href="jsFunctionName()" class="buttonClass">Open Form</link>

并尝试在通过jquery点击的链接上使用jquery对话框。https://jqueryui.com/dialog/例如

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function jsFunctionName() {
    $("#dialog").dialog();
  } );
</script>

<div id="dialog" title="My Form">
  <form>
  </form>
</div>