如何使用javascript

时间:2019-01-25 04:21:46

标签: html css web chatbot

我做了一个聊天机器人,现在我已经将其托管在本地服务器上。

Chat bot

我想将其嵌入到我的网站中,所以我真正想要的是像在此示例中一样在网站右下角徘徊的按钮/图标。

button

然后单击它,应该会在网站上弹出一个聊天机器人窗口。我应该怎么做

open up window

1 个答案:

答案 0 :(得分:1)

基本上,您将拥有两个内容,即弹出窗口和触发器:

<div class="popup">
   ... Popup Stuff
</div>
<button>Click Me</button>

如果将弹出窗口托管在您所在的页面之外,则可以在弹出窗口中使用iframe进行渲染:

<div class="popup">
   <iframe src="http://wherever"/>
</div>
<button>Click Me</button>

您希望按钮切换弹出窗口的显示状态

const button = document.querySelector('button');
const popup = document.querySelector('.popup');

button.addEventListener('click', ()=>{
  popup.style.display === 'none' ? popup.style.display = 'block' : popup.style.display = 'none';
})